*, *:after, *:before{
	border: 0;
	/* Evitar que mis cajas engorden*/
	-ms-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
/*PRELOADER----------------------------------------------------------------------------------------------*/
.sin-scroll{
  /*overflow: hidden;*/
}
.centrar-preloader{
  align-items: center;
  background-color: rgba(255,255,255,1);
  display: flex;
  flex-wrap: wrap;
  height: 100vh;
  justify-content: center;
  position: fixed;
  z-index: 16000162;
  width: 100vw;
}
.logo-preloader{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.logo-pre{
  text-align: center;
  width: 100%;
}
.logo-pre img{
  max-width: 120px;
}
svg {
  display: none;
}
.blobs {
  -webkit-filter: url(#goo);
          filter: url(#goo);
  width: 300px;
  height: 120px;
  position: relative;
  overflow: hidden;
  border-radius: 70px;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}
.blobs .blob-center {
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  position: absolute;
  background: rgba(0,134,191,1);
  top: 50%;
  left: 50%;
  width: 30px;
  height: 30px;
  -webkit-transform-origin: left top;
          transform-origin: left top;
  -webkit-transform: scale(0.9) translate(-50%, -50%);
          transform: scale(0.9) translate(-50%, -50%);
  -webkit-animation: blob-grow linear 3.4s infinite;
          animation: blob-grow linear 3.4s infinite;
  border-radius: 50%;
  box-shadow: 0 -10px 40px -5px rgba(0,134,191,1);
}
.blob {
  position: absolute;
  background: rgba(0,134,191,1);
  top: 50%;
  left: 50%;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  -webkit-animation: blobs ease-out 3.4s infinite;
          animation: blobs ease-out 3.4s infinite;
  -webkit-transform: scale(0.9) translate(-50%, -50%);
          transform: scale(0.9) translate(-50%, -50%);
  -webkit-transform-origin: center top;
          transform-origin: center top;
  opacity: 0;
}
.blob:nth-child(1) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.blob:nth-child(2) {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}
.blob:nth-child(3) {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}
.blob:nth-child(4) {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}
.blob:nth-child(5) {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}
@-webkit-keyframes blobs {
  0% {
    opacity: 0;
    -webkit-transform: scale(0) translate(calc(-330px - 50%), -50%);
            transform: scale(0) translate(calc(-330px - 50%), -50%);
  }
  1% {
    opacity: 1;
  }
  35%,65% {
    opacity: 1;
    -webkit-transform: scale(0.9) translate(-50%, -50%);
            transform: scale(0.9) translate(-50%, -50%);
  }
  99% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0) translate(calc(330px - 50%), -50%);
            transform: scale(0) translate(calc(330px - 50%), -50%);
  }
}
@keyframes blobs {
  0% {
    opacity: 0;
    -webkit-transform: scale(0) translate(calc(-330px - 50%), -50%);
            transform: scale(0) translate(calc(-330px - 50%), -50%);
  }
  1% {
    opacity: 1;
  }
  35%,65% {
    opacity: 1;
    -webkit-transform: scale(0.9) translate(-50%, -50%);
            transform: scale(0.9) translate(-50%, -50%);
  }
  99% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0) translate(calc(330px - 50%), -50%);
            transform: scale(0) translate(calc(330px - 50%), -50%);
  }
}
@-webkit-keyframes blob-grow {
  0%,  39% {
    -webkit-transform: scale(0) translate(-50%, -50%);
            transform: scale(0) translate(-50%, -50%);
  }
  40%, 42% {
    -webkit-transform: scale(1, 0.9) translate(-50%, -50%);
            transform: scale(1, 0.9) translate(-50%, -50%);
  }
  43%, 44% {
    -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%);
            transform: scale(1.2, 1.1) translate(-50%, -50%);
  }
  45%, 46% {
    -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%);
            transform: scale(1.3, 1.2) translate(-50%, -50%);
  }
  47%, 48% {
    -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%);
            transform: scale(1.4, 1.3) translate(-50%, -50%);
  }
  52% {
    -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%);
            transform: scale(1.5, 1.4) translate(-50%, -50%);
  }
  54% {
    -webkit-transform: scale(1.7, 1.6) translate(-50%, -50%);
            transform: scale(1.7, 1.6) translate(-50%, -50%);
  }
  58% {
    -webkit-transform: scale(1.8, 1.7) translate(-50%, -50%);
            transform: scale(1.8, 1.7) translate(-50%, -50%);
  }
  68%, 70% {
    -webkit-transform: scale(1.7, 1.5) translate(-50%, -50%);
            transform: scale(1.7, 1.5) translate(-50%, -50%);
  }
  78% {
    -webkit-transform: scale(1.6, 1.4) translate(-50%, -50%);
            transform: scale(1.6, 1.4) translate(-50%, -50%);
  }
  80%, 81% {
    -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%);
            transform: scale(1.5, 1.4) translate(-50%, -50%);
  }
  82%, 83% {
    -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%);
            transform: scale(1.4, 1.3) translate(-50%, -50%);
  }
  84%, 85% {
    -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%);
            transform: scale(1.3, 1.2) translate(-50%, -50%);
  }
  86%, 87% {
    -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%);
            transform: scale(1.2, 1.1) translate(-50%, -50%);
  }
  90%, 91% {
    -webkit-transform: scale(1, 0.9) translate(-50%, -50%);
            transform: scale(1, 0.9) translate(-50%, -50%);
  }
  92%, 100% {
    -webkit-transform: scale(0) translate(-50%, -50%);
            transform: scale(0) translate(-50%, -50%);
  }
}
@keyframes blob-grow {
  0%,  39% {
    -webkit-transform: scale(0) translate(-50%, -50%);
            transform: scale(0) translate(-50%, -50%);
  }
  40%, 42% {
    -webkit-transform: scale(1, 0.9) translate(-50%, -50%);
            transform: scale(1, 0.9) translate(-50%, -50%);
  }
  43%, 44% {
    -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%);
            transform: scale(1.2, 1.1) translate(-50%, -50%);
  }
  45%, 46% {
    -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%);
            transform: scale(1.3, 1.2) translate(-50%, -50%);
  }
  47%, 48% {
    -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%);
            transform: scale(1.4, 1.3) translate(-50%, -50%);
  }
  52% {
    -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%);
            transform: scale(1.5, 1.4) translate(-50%, -50%);
  }
  54% {
    -webkit-transform: scale(1.7, 1.6) translate(-50%, -50%);
            transform: scale(1.7, 1.6) translate(-50%, -50%);
  }
  58% {
    -webkit-transform: scale(1.8, 1.7) translate(-50%, -50%);
            transform: scale(1.8, 1.7) translate(-50%, -50%);
  }
  68%, 70% {
    -webkit-transform: scale(1.7, 1.5) translate(-50%, -50%);
            transform: scale(1.7, 1.5) translate(-50%, -50%);
  }
  78% {
    -webkit-transform: scale(1.6, 1.4) translate(-50%, -50%);
            transform: scale(1.6, 1.4) translate(-50%, -50%);
  }
  80%, 81% {
    -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%);
            transform: scale(1.5, 1.4) translate(-50%, -50%);
  }
  82%, 83% {
    -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%);
            transform: scale(1.4, 1.3) translate(-50%, -50%);
  }
  84%, 85% {
    -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%);
            transform: scale(1.3, 1.2) translate(-50%, -50%);
  }
  86%, 87% {
    -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%);
            transform: scale(1.2, 1.1) translate(-50%, -50%);
  }
  90%, 91% {
    -webkit-transform: scale(1, 0.9) translate(-50%, -50%);
            transform: scale(1, 0.9) translate(-50%, -50%);
  }
  92%, 100% {
    -webkit-transform: scale(0) translate(-50%, -50%);
            transform: scale(0) translate(-50%, -50%);
  }
}
.loaded #loader {
  opacity: 0;
  transition: all 0.3s ease-out;
  -webkit-transform: scale(1, 0.9) translate(0%, -20%);
            transform: scale(1, 0.9) translate(0%, -20%);
}
.loaded #onload {
  visibility: hidden;
  opacity:0;
  /*-webkit-transform:translateY(-100%);
          transform:translateY(-100%);*/
  /*transition: all 0.3s 1s ease-out;*/
  transition: all 1s;
}
/*FIN PRELOADER*/
/*PRELOADER ENVÍOS--------------------------------------------------------------*/
#divLoading{
  align-items: center;
  background-color: rgba(255,255,255,.8);
  display: none;
  height: 100%;
  justify-content: center;
  position: fixed;
  width: 100%;
  z-index: 100000001;
}
/*FIN PRELOADER ENVÍOS*/
a{
	color: #007bff;
	text-decoration: none;
	transition: all .7s;
}
a:hover{
	color: #101820;
	/*padding-left: .5em;*/
}
audio,iframe,img,svg,video{
  /*margin-bottom: 0;*/
  max-width: 100%;
  vertical-align: bottom;
}
body{
  /*<uniquifier>: Use a unique and descriptive class name*/
  /*<weight>: Use a value from 200 to 1000*/
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  /*font-weight: <weight>;*/
  font-style: normal;
	background-color: #fff;
	color: #666;
	font-size: 18px;
}
body::-webkit-scrollbar-track{
  -webkit-box-shadow: inset 0 0 6px rgba(16,24,32,.5);
  /*border-radius: 10px;*/
  background-color: #F5F5F5;
}
body::-webkit-scrollbar{
  background-color: #F5F5F5;
  width: .6em;
}
body::-webkit-scrollbar-thumb{
  background-color: rgba(0,134,191,1); 
  background-image: -webkit-linear-gradient(45deg,
                                            rgba(255, 255, 255, .2) 25%,
                        transparent 25%,
                        transparent 50%,
                        rgba(255, 255, 255, .2) 50%,
                        rgba(255, 255, 255, .2) 75%,
                        transparent 75%,
                        transparent);
}
/*body::-webkit-scrollbar-thumb:hover{
  background-image: -webkit-linear-gradient(45deg,
                                            rgba(0, 0, 0, .2) 25%,
                        transparent 25%,
                        transparent 50%,
                        rgba(0, 0, 0, .2) 50%,
                        rgba(0, 0, 0, .2) 75%,
                        transparent 75%,
                        transparent);
}*/

/*SCROLL DE LA WEB */
body::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment{
  background-color: #005c83;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
body::-webkit-scrollbar-button:start:decrement{
  /*background-image: url(../images/subir-scroll.png);*/
}
body::-webkit-scrollbar-button:end:increment{
  /*background-image: url(../images/bajar-scroll.png);*/
}
/* FIN DEL SCROLL DE LA WEB -------------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6{
  /*<uniquifier>: Use a unique and descriptive class name*/
  /*<weight>: Use a value from 200 to 700*/
  color: #000;
	font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  /*font-weight: <weight>;*/
  font-style: normal;
  line-height: 1.5;
  margin: 1rem 0;
}
h2{
  font-size: 1.8em;
  margin: 0 0 1rem 0;
}
ol,ul{
  list-style: none;
}
li{
  line-height: 1.5;
}
p{
  line-height: 1.5;
  margin-bottom: 2em;
}
/*FIN DE ELEMENTOS NATURALES HTML*/
/*REJILLA HOME-----------------------------------------------------------------------------------------------------*/
#rejilla-principal{
  display: grid;
  grid-template-areas: 
    "headerp"
    "mainp"
    "invisible"
    "footerp";
  /*height: 100vh;*/
  width: 100%;
}
.ancho-max{
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
header#header-principal{
  display: grid;
  grid-area: headerp;
  grid-template-areas: 
    "preheader"
    "postheader";
  position: fixed;
  top: 0;
  transition: top .8s;
  width: 100%;
  z-index: 2;
}
#pre-header{
  background-color: #00c853;
  box-shadow: 1px 2px 5px rgba(16,24,32,.5);
  font-size: .9em;
  grid-area: preheader;
  /*padding: .7em 0;*/
  z-index: 3;
}
#post-header{
  background-color: #0d1b2a;
  grid-area: postheader;
  /*padding: .8em 0;*/
}
.whatsapp-premenu-extraico,.logo-postmenu{
  align-items: center;/*Alinear arriba, centro y abajo tanto en FlexBOX como en GRID*/
  display: grid;
  grid-gap: 1em;
  grid-template-areas: 
    "whatsapp extraico";/*Dos columnas*/
  grid-template-columns: max-content 1fr max-content;
  /*justify-items:center;/*Alinear a la izquierda, centro y a la derecha el contenido de sus grid items*/
  margin: auto;
  max-width: 1280px;
  width: 95%;
}
.logo-postmenu{
  grid-template-areas: 
    "logo postmenu";/*Dos columnas*/
  grid-template-columns: max-content 1fr;
}
.whatsapp-enlace{
  display: flex;
}
#whatsapp{
  align-items: center;
  color: rgba(255,255,255,.5);
  display: flex;
  flex-wrap: wrap;
  height: 100%;
  justify-self: start;
  grid-area: whatsapp;
  /*padding: .7em 0;*/
}
#whatsapp i{
  color: #0d1b2a;
  margin: 0 .25em;
}
.whatsapp-txt{
  color: #0d1b2a;
  padding: .7em;
}
#whatsapp a{
  color: #0d1b2a;
  padding: .7em;
}
#whatsapp a i{
  color: #0d1b2a;
  transition: all .7s;
}
#whatsapp a:last-child{
  padding-right: 0;
}
#whatsapp a:hover,#whatsapp a:hover i{
  color: #007bff;
}
#pre-menu{
  /*align-self: center;Alinear arriba - centro y abajo al GRID Item Independiente*/
  grid-area: premenu;
  height: 100%;
  justify-self:end;/*Alinear a la izquieda - centro y derecha el GRID Item Independiente*/
}
.pre-menupc,.post-menupc{
  height: 100%;
  width: 100%;
}
.pre-menupc ul,.post-menupc ul{
  display: flex;
}
.pre-menupc ul li a{
  color: rgba(255,255,255,.65);
  padding: .7em;
}
.pre-menupc ul li a.iniciaizq{
  padding-left: 0;
}
.pre-menupc ul li:last-child a{
  padding-right: 0;
}
.pre-menupc ul li a.idiomas{
  justify-content: flex-end;
  padding-right: .7em;
}
.subpre-menup ul li a{
  display: flex;
}
.subpre-menup ul li a span{
  margin-right: .25em;
}
.pre-menupc ul li a:hover,.pre-menupc ul li a.active{
  color: rgba(0,134,191,1);
}
.pre-menupc ul ul,#extra-ico ul ul.ayudar-sub{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;

  height: auto;
  min-width: 196px;
  margin: 20px 0 0 0;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: 45px;
  z-index: 1;
  /*right: 355px;*/
  background: #ffffff;
  box-shadow: 0 0 5px #999;
  -webkit-box-shadow: 0 0 5px #999;
  -moz-box-shadow: 0 0 5px #999;
  -o-box-shadow: 0 0 5px #999;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  padding: 0;
}
#extra-ico ul ul.ayudar-sub{
  right: 0;
  width: 215px;
}
.pre-menupc ul ul{
  min-width: 192px;
  left: 0;
}
.pre-menupcb ul ul{
  min-width: 120px;
  left: -60px;
}
.pre-menupc ul ul:after{
  bottom: 100%;
  left: 40px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #fff;
  border-width: .5em;
  margin-left: -10px;
}
.pre-menupcb ul ul:after{
  left: 104px;
}
.idioma-bandera{
  align-items: center;
  display: flex;
}
.idioma-bandera .banderitap{
  margin: 0 .25em;
  width: 1.35em;
}
.banderitas{
  width: 1.5em;
}
#extra-ico ul ul.ayudar-sub:after{
  bottom: 100%;
  right: 24px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #fff;
  border-width: .5em;
  margin-right: -10px;
}
.pre-menupc ul ul a,#extra-ico ul ul.ayudar-sub a{
  color: rgba(0,134,191,1);
  padding: .5em 1em;
  width: 100%;
}
.pre-menupc ul ul a:hover,#extra-ico ul ul.ayudar-sub a:hover{
  /*background-color: rgba(16,24,32,.1);
  color: rgba(16,24,32,1);*/
  background-color: rgba(0,134,191,1);
  color: rgba(255,255,255,1);
}
.pre-menupc ul ul a.active,#extra-ico ul ul.ayudar-sub a.active{
  background-color: rgba(16,24,32,.1);
  color: rgba(16,24,32,1);
  cursor: default;
}
.pre-menupc li:hover > ul,#extra-ico li:hover > ul.ayudar-sub{
  opacity: 1;
  visibility: visible;
  margin: 0;
  z-index: 9999;
}
.division-desplegable{
  border-color: rgba(16,24,32,.2);
  border-style: solid;
  border-width: 1px;
  width: 100%;
}
/*.pre-menupc ul ul{
  display: none;
}
.pre-menupc ul li:hover ul{
  background-color: #fff;
  transition: all 0.3s ease;
  display: block;
  position: absolute;
  height: 100%;
}*/
#extra-ico,#extra-icob{
  display: flex;
  grid-area: extraico;
  height: 100%;
  justify-self: end;
  /*width: 100%;*/
}
#extra-icob{
  justify-content: flex-end;
}
#extra-ico ul,#extra-icob ul{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#extra-ico ul li,#extra-icob ul li{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  height: 44px;
  position: relative;
  width: 44px;
}
#extra-icob #idioma ul li{
  width: 100%;
}
#extra-icob #idioma ul li a{
  color: #101820;
}
#extra-icob #idioma ul li a:hover{
  color: #fff;
}
#extra-icob #idioma ul li a.idioma-bandera:hover{
  color: #101820;
}
#extra-icob .pre-menupc{
  width: auto;
}
#idioma{
  grid-area: idioma;
}
.contenedor-carrito{
  margin-right: 1em;
}
.contenedor-carritob{
  margin-right: .25em;
}
#extra-ico ul li a,#extra-icob ul li a{
  align-items: center;
  color: #0d1b2a;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  /*border-right-color: rgba(0,134,191,1);
  border-right-style: solid;
  border-right-width: 1px;*/
  height: 100%;
  width: 100%;
}
#extra-ico ul li a{
  cursor: pointer;
}
#extra-ico ul li a:hover,#extra-ico ul li a.active
#extra-icob ul li a:hover,#extra-icob ul li a.active{
  background-color: rgba(255,255,255,.1);
  color: #007bff;
}
#extra-ico ul li a:hover .contar-carrito,#extra-ico ul li a.active .contar-carrito{
  background-color: rgba(255,255,255,1);
  color: #666;
}
span.contar-carrito::before{
  content: attr(data-notify);
  position: absolute;
  top: 7px;
  right: 0;
  background-color: rgba(0,134,191,1);
  transition: all .3s ease-in-out;
  display: inline-block;
  /*min-width: 10px;
  min-height: 10px;*/
  padding: 3px;
  font-size: .85em;
  font-weight: 700;
  /*line-height: 1;*/
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  border-radius: 10px;
}
.pre-menupc ul,.post-menupc ul{
  align-items: center;
  /*border-bottom: 2px rgba(0,134,191,1) solid;*/
  display: grid;
  /*grid-gap: 1em;*/
  grid-template-columns: repeat(7, max-content);
  height: 100%;
}
.pre-menupc ul li,.post-menupc ul li{
  align-items: center;
  display: flex;
  height: 100%;
}
.pre-menupc ul li.subpre-menup,#extra-ico ul li.ayudar{
  position: relative;
}
.pre-menupc ul ul li,#extra-ico ul ul.ayudar-sub li{
  height: auto;
  width: 100%;
}
#extra-ico ul ul.ayudar-sub li,#extra-ico ul ul.ayudar-sub li a{
  justify-content: flex-start;
}
.sinclic{
  pointer-events: none;
}
/*BUSCADOR-------------------------------------------------------------------------------*/
form.form-buscar{
  position: absolute;
  display: flex;
  justify-content: space-between;
  align-items: center;
  right: 0;
}
form .search-box{
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  right: 1em;
  transform: translate(0%,0%);
  /*background-color: #2f3640;
  height: 40px;
  padding: .5em;
  top: 0;*/
}
form .search-box:hover{
  /*max-width: 230px;*/
}
form .search-box:hover > .search-txt{
  background-color: #fff;
  padding: .5em;
  width: 200px;
}
form .search-box:hover > .search-btn{
  background-color: transparent;
}
form .search-btn{
  color: #fff;
  margin-left: .5em;
}
form .search-txt{
  background-color: transparent;
  border:none;
  outline: none;
  padding: 0;
  color: white;
  font-size: 1em;
  transition: .4s;
  /*line-height: 2em;*/
  width: 0;
}
form input.search-txt{
  color: #666;
}
/*FIN BUSCADOR---------------------------------------------------------------------------*/
/*MENU LATERAL---------------------------------------------------------------------------*/
/*MENU CARRITO---------------*/
.shopping_cart{
  /*max-height: 250px;*/
  overflow-x: hidden;
  overflow-y: auto;
  width: 100%;
}
/*SCROLL CARRITO------------------------------------------*/
.shopping_cart::-webkit-scrollbar-track{
  -webkit-box-shadow: inset 0 0 6px rgba(16,24,32,.5);
  /*border-radius: 10px;*/
  background-color: #F5F5F5;
}
.shopping_cart::-webkit-scrollbar{
  background-color: #F5F5F5;
  width: .6em;
}
.shopping_cart::-webkit-scrollbar-thumb{
  background-color: rgba(16,24,32,1); 
  background-image: -webkit-linear-gradient(45deg,
                                            rgba(255, 255, 255, .2) 25%,
                        transparent 25%,
                        transparent 50%,
                        rgba(255, 255, 255, .2) 50%,
                        rgba(255, 255, 255, .2) 75%,
                        transparent 75%,
                        transparent);
}
/*body::-webkit-scrollbar-thumb:hover{
  background-image: -webkit-linear-gradient(45deg,
                                            rgba(0, 0, 0, .2) 25%,
                        transparent 25%,
                        transparent 50%,
                        rgba(0, 0, 0, .2) 50%,
                        rgba(0, 0, 0, .2) 75%,
                        transparent 75%,
                        transparent);
}*/
.shopping_cart::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment{
  background-color: #005c83;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.shopping_cart::-webkit-scrollbar-button:start:decrement{
  /*background-image: url(../images/subir-scroll.png);*/
}
.shopping_cart::-webkit-scrollbar-button:end:increment{
  /*background-image: url(../images/bajar-scroll.png);*/
}
/*FIN SCROLL CARRITO--------------------------------------------*/
/* start icon styles */
.sub-icon1 h3{
  font-size:1.3em;
  padding:0 0 0.5em;
  color:rgba(16,24,32,1);
  margin: 0 0 .3em 0;
}
.icon1:before,.icon1:after {
  content: "";
  display: table;
}
.icon1:after {
  clear: both;
}
ul.icon1{
  float:right;
  zoom: 1;
  list-style: none;
  padding: 0;
  margin-left:0;
}
.icon1 li {
  float: left;
  position: relative;
}
.icon1 li:last-child{
  border-right:none;
}
.icon1 li:hover > a {
  color: #fafafa;
}
*html .icon1 li a:hover { /* IE6 only */
  color: #fafafa;
}
.icon1 ul.list {
  width:250px;
  margin: 20px 0 0 0;
  opacity: 0;
  visibility: hidden;
  top:45px;
  z-index: 1;
  right: -88px;
  background: #ffffff;
  box-shadow: 0 0 5px #999;
  -webkit-box-shadow: 0 0 5px #999;
  -moz-box-shadow: 0 0 5px #999;
  -o-box-shadow: 0 0 5px #999;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  padding:1em;
  position: absolute;
}
.icon1 ul.list:after{
  bottom: 100%;
  right: 100px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #fff;
  border-width: .5em;
  margin-left: -10px;
}
.icon1 li:hover > ul {
  opacity: 1;
  visibility: visible;
  margin: 0;
  z-index: 9999;
}
.icon1 ul ul {
  top: 6px;
  left: 158px;
  margin: 0 0 0 20px;
}
.icon1 ul li {
  /*--float: none;--*/
  display: block;
  border: 0;
}
.icon1 ul li:first-child{
  border-top:none;
}
.icon1 ul li:first-child a{
  /*border-top-left-radius: 5px;
  -webkit-border-top-left-radius: 5px;
  -moz-border-top-left-radius: 5px;
  -o-border-top-left-radius: 5px;*/
}
.icon1 ul li:last-child {   
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;    
}
.icon1 ul a {    
  _height: 10px; /*IE6 only*/
  /*white-space: nowrap;*/
  float: none;
  text-transform: none;
}
.active-icon{
  display: block;
}
.icon1 ul li:first-child > a:after {
  content: '';
  position: absolute;
  left: 45%;
  top: -30px;
  border-left: 10px solid transparent;
  border-right:10px solid transparent;
  border-bottom:10px solid #f0f0f0;
}
.icon1 ul ul li:first-child a:after {
  left: -100px;
  top: 0%;
  margin-top: -6px;
  border-left: 0; 
  border-bottom:20px solid transparent;
  border-top: 20px solid transparent;
  border-right:20px solid #323757;
}
#extra-ico ul ul.ayudar-sub li > a:after{
  border-left: none;
  border-right: none;
  border-bottom: none;
}
/* Mobile */
.icon1-trigger {
  display: none;
}
.sub-icon1 img{
  border:none;
  display:inline-block;
  vertical-align:middle;
}
.cart_box,.cart_box1{
  border-bottom:1px solid #E0E0E0;
  padding:.6em;
}
.cart_box2{
padding:.6em; 
}
.list_img{
  /*float:left;*/
  width:20%;
  border:1px solid #e0e0e0;
  /*margin-right:6%;*/
}
.list_desc{
  /*float:left;*/
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  position: absolute;
  right: 1.6em;
  width: 64%;
}
.list_desc h4{
  line-height: .8em;
  margin: 0;
  width: 100%;
}
.list_desc p{
  font-size: .9em;
  width: 100%;
}
.list_desc h4 a{
  color:#101820 !important;
  font-size:.7em !important;
  text-decoration:none;
  font-weight:400;
  text-transform:uppercase;
  padding: 0 0 !important;
}
#extra-ico ul li a.titulo-serv{
  justify-content: flex-start;
}
span.actual{
  color:rgba(0,134,191,1);
  font-weight:bold;
}
.list_desc h4 a:hover{
  color: #f54d56;
}
.total{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  padding: .5em 1.3em .5em .5em;
  /*background: rgba(0,134,191,.2);*/
  margin-bottom: 0.5em;
  width: 100%;
}
.cart_box,.cart_box1,.cart_box2{
  display: flex;
  position:relative;
  width: 100%;
}
.message,.message1,.message2{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.alert-close,.alert-close1,.alert-close2 {
  /*background:#fb5e33 url('../images/close.png') no-repeat 6px 6px;*/
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  cursor: pointer;
  font-size: .7em;
  height: 22px;
  width: 22px;
  position: absolute;
  right:5px;
  top:auto;
  -webkit-transition: color 0.2s ease-in-out;
  -moz-transition: color 0.2s ease-in-out;
  -o-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
}
.total_left{
  color: rgba(16,24,32,.6);
  font-size: .9em;
  margin-right: .5em;
  /*float:left;*/
}
.total_right{
  /*float:right;*/
  color:#101820;
  font-size: 1.1em;
  font-weight:600;
  /*position: absolute;*/
  right: 1.65em;
}
.login_buttons{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 1.5em;
  padding: 0 .5em;
  width: 100%;
}
.check_button,.view_button{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  text-align:center;
  width: 49%;
}
.view_button{
  /*margin-right: .25em;*/
  order: 1;
  /*position: absolute;*/
  /*right: 1em;*/
}
.check_button{
  order: 2;
}
.check_button a,.view_button a{
  /*border-color: rgba(0,134,191,1);
  border-style: solid;
  border-width: 1px;*/
  color:rgba(255,255,255,1);
  font-size:.85em;
  text-transform:uppercase;
  font-weight:bold;
  text-decoration:none;
  /*border: none;*/
  cursor: pointer;
  padding:8px 10px !important; 
  display: inline-block;
  outline: none;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  background: rgba(0,134,191,1);
  /*margin:10px auto 0;*/
  width:100%;
}
/*.check_button a:hover,.login_button a:hover{
  background:#101820;
  color:#fff !important;
}*/
.check_button a i,.view_button a i{
  margin-left: .5em;
}
#extra-ico ul li a.carrito-btn{
  color: rgba(255,255,255,1);
  justify-content: space-between;
  margin-right: 0;
}
#extra-ico ul li a.carrito-btn:hover{
  background-color: rgba(16,24,32,1);
  border:none;
  color: rgba(255,255,255,1);
}
/*FIN MENU CARRITO*/
.pushbar.opened{
display: block;
}

html.pushbar_locked{
    overflow: hidden;
    -ms-touch-action: none;
    touch-action: none;
}
.pushbar_locked .pushbar_main_content.pushbar_blur{
  filter:blur(15px);
}
.pushbar,.pushbar-carrito{
  z-index: 1000;
  position: fixed;
  will-change: transform;
  overflow-y: auto;
  transition:transform 0.5s ease;
  will-change: transform;
  background:rgba(0,134,191,1);
}
.pushbar-carrito{
  background-color: #fff;
}
.pushbar-carrito h3{
  align-items: center;
  color: rgba(0, 0, 0, 1);
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  font-size: 1em;
  padding: .5em;
  width: 81%;
}
.pushbar-carrito h3 i{
  margin-right: .5em;
}
.pushbar_overlay{
  z-index: -999;
  position: fixed;
  width: 100%;
  max-width: 100%;
  height: 100%;
  min-height: 100vh;
  top: 0;
  left: 0;
  will-change: opacity;
  opacity:0;
  will-change: opacity;
  background: rgba(16,24,32,.8);
  backdrop-filter: blur(9px);
  transition:opacity .7s ease;
}
html.pushbar_locked .pushbar_overlay{
  opacity:.8;
  z-index: 16000161;
}
.pushbar.from_left{
  top: 0;
  left: 0;
  width: 256px;
  max-width: 100%;
  height: 100%;
  min-height: 100vh;
  transform: translateZ(0) translateX(-100%);
}
.pushbar.from_right{
  top: 0;
  right: 0;
  max-width: 330px;
  width: 100%;
  height: 75%;
  max-height: 410px;
  /*min-height: 100vh;*/
  transform: translateZ(0) translateX(100%);
  z-index: 16000162;
}
.alto-lateral{
  min-height: 100vh;
}
.pushbar.from_top{
  top: 0;
  right: 0;
  width: 100%;
  max-width: 80%;
  min-height: 150px;
  transform: translateZ(0) translateY(-100%);
}
.legal-mesa{
  background-color: #fff;
  height: 100%;
  overflow-x: clip;
  z-index: 16000162;
}
.legal-mesa .ancho-max{
  max-width: 1200px;
}
.close-legal{
  width: 20px;
  height: 21px;
  position: relative;
  display: inline-block;
  margin-right: 1em;
  vertical-align: text-bottom;
  text-align: center;
  cursor: pointer;
}
.close-legal:before,.close-legal:after{
  position: absolute;
  left: 10px;
  content: ' ';
  height: 21px;
  width: 3px;
  background-color: rgba(0,134,191,1);
}
.close-legal:before{
  transform: rotate(45deg);
}
.close-legal:after{
  transform: rotate(-45deg);
}
.titulo-legal{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  margin: 1.5em auto;
  max-width: 1200px;
  width: 95%;
}
.titulo-legal h2{
  margin: 0;
}
.pushbar.from_bottom{
  bottom: 0;
  left: 0;
  width: 100%;
  max-width: 100%;
  min-height: 150px;
  transform: translateZ(0) translateY(100%);
}
.pushbar.opened{
   transform: translateX(0px) translateY(0px);
}
/*SCROLL MENU LATERAL------------------------------------------*/
.pushbar.opened::-webkit-scrollbar-track{
  -webkit-box-shadow: inset 0 0 6px rgba(16,24,32,.5);
  /*border-radius: 10px;*/
  background-color: #F5F5F5;
}
.pushbar.opened::-webkit-scrollbar{
  background-color: #F5F5F5;
  width: .6em;
}
.pushbar.opened::-webkit-scrollbar-thumb{
  background-color: rgba(16,24,32,1); 
  background-image: -webkit-linear-gradient(45deg,
                                            rgba(255, 255, 255, .2) 25%,
                        transparent 25%,
                        transparent 50%,
                        rgba(255, 255, 255, .2) 50%,
                        rgba(255, 255, 255, .2) 75%,
                        transparent 75%,
                        transparent);
}
/*body::-webkit-scrollbar-thumb:hover{
  background-image: -webkit-linear-gradient(45deg,
                                            rgba(0, 0, 0, .2) 25%,
                        transparent 25%,
                        transparent 50%,
                        rgba(0, 0, 0, .2) 50%,
                        rgba(0, 0, 0, .2) 75%,
                        transparent 75%,
                        transparent);
}*/
.pushbar.opened::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment{
  background-color: #005c83;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.pushbar.opened::-webkit-scrollbar-button:start:decrement{
  /*background-image: url(../images/subir-scroll.png);*/
}
.pushbar.opened::-webkit-scrollbar-button:end:increment{
  /*background-image: url(../images/bajar-scroll.png);*/
}
/*FIN SCROLL MENU LATERAL--------------------------------------------*/
.btn-ayudando{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  height: 100%;
  width: 100%;
}
.btn-menu,.btn-menub{
  color: #fff;
  width: 100%;
  height: 100%;
  background: transparent;
  cursor: pointer;
  font-size: 1em;
  transition: .3s ease all;
}
.btn-menub{
  color: #101820;
}
#menu-l{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  width: 100%;
}
.btn-cerrar,.btn-cerrar-b{
  align-items: center;
  /*background-color: rgba(16,24,32,.2);*/
  border-bottom-color: rgba(255,255,255,.1);
  border-bottom-style: solid;
  border-bottom-width: 1px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  width: 100%;
}
.btn-cerrar-b{
  border-bottom-color: rgba(16,24,32,.2);
  border-bottom-style: solid;
  border-bottom-width: 1px;
  justify-content: space-between;
  padding: 0 .5em;
}
.btn-cerrar a,.btn-cerrar-b a{
  background-color: transparent;
  color: rgba(255,255,255,1);
  cursor: pointer;
  font-size: 1em;
  padding: .5em;
}
.btn-cerrar-b a{
  /*background-color: rgba(16,24,32,1);*/
  color: rgba(16,24,32,1);
  /*width: 15%;*/
}
ul.lateral-menu{
  position:relative;
  width:100%;
  margin:0;
  padding-left:0;
  list-style:none;
  display: flex;
  flex-wrap: wrap;
}
ul.lateral-carrito{
  display: flex;
  flex-wrap: wrap;
  padding: .75em;
  width: 100%;
}
ul.lateral-menu li,ul.lateral-carrito li{
  align-items: center;
  border-bottom-color: rgba(16,24,32,.3);
  border-bottom-style: solid;
  border-bottom-width: 1px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  width: 100%;
}
ul.lateral-carrito li{
  border-bottom-color: rgba(16,24,32,.1);
  box-shadow: 1px 2px 8px rgba(16,24,32,.2);
  justify-content: space-between;
  margin-bottom: .5em;
}
ul.lateral-carrito li a{
  /*padding: .4em;*/
}
ul.lateral-carrito li div{
  color: #0086bf;
  cursor: pointer;
  padding: .4em;
}
/*ANIMAR AL ELIMINAR ELEMENTO DEL CARRITO------------------------*/

/*------------------------*/
ul.lateral-carrito li .nombre-prod-carrito{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  padding: .25em;
  width: 65%;
}
ul.lateral-carrito li .nombre-prod-carrito a{
  color: #101820;
  font-size: .8em;
  /*font-weight: bold;*/
  padding: 0;
  width: 100%;
}
ul.lateral-carrito li .nombre-prod-carrito p{
  color: rgba(16,24,32,.5);
  font-size: .85em;
}
ul.lateral-carrito li img{
  margin-right: .25em;
  max-width: 50px;
  width: 20%;
}
ul.lateral-menu li a{
  background-color: transparent;
  color: rgba(255,255,255,.6);
  font-size: .9em;
  padding: .5em 1em;
  width: 100%;
}
ul.lateral-menu li a:hover,ul.lateral-menu li a.active{
  background-color:  rgba(16,24,32,.3);
  color: rgba(255,255,255,1);
}
ul.lateral-menu li a:after{
  display: none;
}
/*FIN DEL MENU LATERAL*/
.post-menupc ul li a{
  align-items: center;
  color: #fff;
  display: flex;
  height: 100%;
  flex-wrap: wrap;
  justify-content: center;
  font-size: .85em;
  padding: 0 .85em;
  width: 100%;
}
#logo{
  grid-area: logo;
  padding: .8em 0;
}
#logo img{
  height: 50px;
}
#post-menu{
  /*align-self: center;Alinear arriba - centro y abajo al GRID Item Independiente*/
  grid-area: postmenu;
  height: 100%;
  justify-self:end;/*Alinear a la izquieda - centro y derecha el GRID Item Independiente*/
}
/*EFECTO ELEMENTOS DEL MENÚ PRINCIPAL*/
/* Bounce To Bottom */
.hvr-bounce-to-bottom:hover, .hvr-bounce-to-bottom:focus, .hvr-bounce-to-bottom:active {
  color: #00c853;
}
/*FIN DEL EFECTO DEL MENÚ PRINCIPAL*/
/*---------------------------------------------------*/
header#header-principal-b{
  background-color: #fff;
  border-bottom: 2px solid rgba(0,134,191,1);
  display: none;
  grid-area: headerp;
  padding: .8em 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1059;
}
.menupb-logob-carritob{
  align-items: center;
  display: grid;
  grid-gap: 2em;
  grid-template-areas: 
    "menub logob carritob";
  margin: auto;
  /*max-width: 1280px;*/
  width: 95%;
}
.menupb{
  grid-area: menub;
  min-width: 30px;
}
.logob{
  grid-area: logob;
  text-align: center;
}
.buscadorb{
  grid-area: carritob;
  text-align: right;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  min-width: 40px;
  position: relative;
}
.buscadorb a{
  align-items: center;
  color: #101820;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  height: 40px;
  width: 40px;
}
.buscadorb a svg{
  color: #101820;
  font-size: 1.2em;
}
.buscadorb a:before{
  color: #101820;
  transition: all .7s;
}
.buscadorb a:hover:before{
  color: rgba(0,134,191,1);
}
.lax-superpuesta{
  border-radius: 0;
  transition: all .7s;
}
.lax-superpuesta:hover{
  background-color: rgba(0,134,191,1);
  border-radius: 50%;
}
/*ACTIVE DE LOS MENUS-------------------------------------------------------------------------------------*/
#activa-inicio .preactivacion1,#activa-conocenos .preactivacion2,
#activa-proyectos-portafolio .preactivacion3,#activa-proyectos-testimonios .preactivacion3,#activa-proyectos-pagos .preactivacion3,
#activa-blog .preactivacion7,#activa-contacto .preactivacion8{
  color: #00c853; 
}
#activa-nosotros .preactivacion1{
  padding-left: 0;
}
/*DESPLEGABLES--------------------------------------------------------------------------------------*/
#activa-proyectos-portafolio .preactivacion4,#activa-proyectos-testimonios .preactivacion5,
#activa-proyectos-pagos .preactivacion6,#activa-proyectos-preguntas .preactivacion7,#activa-proyectos-tips .preactivacion8{
  background-color: rgba(0,134,191,1);
  color: rgba(255,255,255,1);
}
/*ACTIVA MENU LATERAL*/
#activa-asi .preactivacion19,#activa-metodos .preactivacion20,#activa-aprende .preactivacion21,
#activa-preguntas .preactivacion22,#activa-tips .preactivacion23{
  background-color:  rgba(16,24,32,.3);
  color: rgba(255,255,255,1);
}
/*FIN DE ACTIVA MENU LATERAL*/
/*ACTIVA MENU SERVICIOS*/
#activa-marketing .preactivacion12,#activa-ux .preactivacion13,#activa-web .preactivacion14,#activa-grafico .preactivacion15,
#activa-multimedia .preactivacion16,#activa-app .preactivacion17,#activa-eventos .preactivacion18{
  color: #00c853;
  text-shadow: 1px 1px 1px rgba(16,24,32,.5);
}
/*FIN DE MENU ACTIVA MENU LATERAL*/
/*FIN DEL ACTIVE DE LOS MENUS-----------------------------------*/
/*ESTILOS PARA TITLE DE HIPERVÍNCULO..................................................*/
/*[data-title]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}*/
[data-title]:after {
    content: attr(data-title);
    background-color: #333;
    color: #fff;
    font-size: 14px;
    position: absolute;
    padding: 3px 20px;
    bottom: -1em;
    right: 80%;
    white-space: nowrap;
    box-shadow: 1px 1px 3px #222222;
    opacity: 1;
    border: 1px solid #111111;
    z-index: 99999;
    visibility: visible;
    border-radius: 6px;
    
}
[data-title] {
    position: relative;
}
/*MENU RESPONSIVE----------------------------------------------------*/
nav.navegacion:not(.mm) {
  display: none;
}
.menupb a{
  display: block;
  width: 1.5em;
  /*height: 18px;
  padding: 11px;
  margin: 5px;
  position: absolute;*/
  top: 0;
  left: 0;
}
.menupb a:before,
.menupb a:after{
  content: '';
  display: block;
  background: #fff;
  height: 2px;
}
.menupb a span{
  background: #fff;
  display: block;
  height: 2px;
  margin: 6px 0;
}
/*OTRO CÓDIGO DEL MENÚ PRINCIPAL RESPONSIVE NUEVO-------------------------------*/
/*!
 * mmenujs.com/mmenu-light
 *
 * Copyright (c) Fred Heusschen
 * www.frebsite.nl
 *
 * License: CC-BY-4.0
 * http://creativecommons.org/licenses/by/4.0/
 */.mm,.mm a,.mm li,.mm span,.mm ul{
  display:block;
  padding:0;
  margin:0;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  }:root{
    --mm-item-height:50px;
    --mm-item-indent:20px;
    --mm-line-height:24px;
  }
  .mm-hidden{
    display:none!important;
  }
  .mm{
    -webkit-tap-highlight-color:transparent;
    -webkit-overflow-scrolling:touch;
    overflow:hidden;
    -webkit-clip-path:inset(0 0 0 0);
    clip-path:inset(0 0 0 0);
    color:#fff;
    background:#f3f3f3;
    line-height:24px;
    line-height:var(--mm-line-height);
    -webkit-transform:translateX(0);
    -ms-transform:translateX(0);
    transform:translateX(0);
  }
  .mm{
    cursor:pointer;
  }
  .mm:before{
    content:'';
    display:block;
    position:absolute;
    top:25px;
    top:calc(var(--mm-item-height)/ 2);
    left:20px;
    left:var(--mm-item-indent);
    width:10px;
    height:10px;
    margin-top:2px;
    border-top:2px solid;
    border-left:2px solid;
    -webkit-transform:rotate(-45deg) translate(50%,-50%);
    -ms-transform:rotate(-45deg) translate(50%,-50%);
    transform:rotate(-45deg) translate(50%,-50%);
    opacity:.4;
  }
  .mm.mm--main{
    cursor:default;
  }
  .mm.mm--main:before{
    content:none;
    display:none;
  }
  .mm:after{
    content:attr(data-mm-title);
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:50px;
    height:var(--mm-item-height);
    padding:0 40px;
    padding:0 calc(var(--mm-item-indent) * 2);
    line-height:50px;
    line-height:var(--mm-item-height);
    opacity:.6;
    text-align:center;
    overflow:hidden;
    white-space:nowrap;
    -o-text-overflow:ellipsis;
    text-overflow:ellipsis;
    -webkit-box-shadow:0 1px 0 0 rgba(16,24,32,.3)/*,0 1px 0 0 currentColor*/;
    box-shadow:0 1px 0 0 rgba(16,24,32,.3)/*,0 1px 0 0 currentColor*/;
  }
  .mm.mm--main:after{
    padding-left:20px;
    padding-left:var(--mm-item-indent);
  }
  .mm ul{
    -webkit-overflow-scrolling:touch;
    position:fixed;
    top:50px;
    top:var(--mm-item-height);
    left:100%;
    bottom:0;
    width:200%;
    padding-right:100%;
    overflow:visible;
    /*overflow-y:auto;*/
    background:#007bff;
    -webkit-transition:left .3s ease 0s;
    -o-transition:left .3s ease 0s;
    transition:left .3s ease 0s;
    cursor:default;
  }
  .mm ul:after{
    content:'';
    display:block;
    height:50px;
    height:var(--mm-item-height);
  }
  .mm>ul{
    left:0;
  }
  .mm ul.mm--open{
    left:0;
  }
  .mm ul.mm--parent{
    left:-100%;
    overflow-y:hidden;
  }
  .mm li{
    position:relative;
    background:#007bff;
    cursor:pointer;
  }
  .mm li:before{
    content:'';
    display:block;
    position:absolute;
    top:25px;
    top:calc(var(--mm-item-height)/ 2);
    right:25px;
    right:calc(var(--mm-item-height)/ 2);
    z-index:0;
    width:10px;
    height:10px;
    border-top:2px solid;
    border-right:2px solid;
    -webkit-transform:rotate(45deg) translate(0,-50%);
    -ms-transform:rotate(45deg) translate(0,-50%);
    transform:rotate(45deg) translate(0,-50%);
    opacity:.4;
  }
  .mm li:after{
    content:'';
    display:block;
    margin-left:20px;
    margin-left:var(--mm-item-indent);
    border-top:1px solid #0d1b2a;
    opacity:.15;
  }
  .mm a,.mm span{
    position:relative;
    z-index:1;
    padding:0 20px;
    padding:calc((var(--mm-item-height) - var(--mm-line-height))/ 2) var(--mm-item-indent);
  }
  .mm span{
    padding:.5em;
  }
  .mm a{
    background:inherit;
    color:#101820;
    font-weight: bold;
    text-decoration:none;
  }
  .mm a:not(:last-child){
    width:calc(100% - 50px);
    width:calc(100% - var(--mm-item-height));
  }
  .mm a:not(:last-child):after{
    content:'';
    display:block;
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    border-right:1px solid;
    opacity:.15;
  }
  .mm a{
    padding:0 .5em;
  }
  .mm ul a{
    padding:.5em;
  }
  .mm span{
    background:0 0;
  }
  .mm.mm--dark{
    background:#333;
    color:#ccc;
  }
  .mm.mm--vertical:after,.mm.mm--vertical:before{
    content:none;
    display:none;
  }
  .mm.mm--vertical{
    overflow-y:auto;
  }
  .mm.mm--vertical ul{
    width:100%;
    padding-right:0;
    position:static;
  }
  .mm.mm--vertical ul ul{
    display:none;
    padding-left:20px;
    padding-left:var(--mm-item-indent);
  }
  .mm.mm--vertical ul ul:after{
    height:25px;
    height:calc(var(--mm-item-height)/ 2);
  }
  .mm.mm--vertical ul.mm--open{
    display:block;
  }
  .mm.mm--vertical li.mm--open:before{
    -webkit-transform:rotate(135deg) translate(-50%,0);
    -ms-transform:rotate(135deg) translate(-50%,0);
    transform:rotate(135deg) translate(-50%,0);
  }
  .mm.mm--vertical ul ul li:last-child:after{
    content:none;
    display:none}:root{
      --mm-width:80%;
      --mm-min-width:200px;
      --mm-max-width:440px;
    }
  .mm-body--open{
    /*overflow-y:hidden;*/
    overflow-y:visible;
    pointer-events:none;
  }
  .mm{
    pointer-events:auto;
  }
  .mm.mm--offcanvas{
    background-color:#007bff;
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    z-index:1100;
    width:80%;
    width:var(--mm-width);
    min-width:200px;
    min-width:var(--mm-min-width);
    max-width:440px;
    max-width:var(--mm-max-width);
    overflow-y: auto;
    -webkit-transition:bottom 0s ease 0s,-webkit-transform .3s ease 0s;
    transition:bottom 0s ease 0s,-webkit-transform .3s ease 0s;
    -o-transition:transform .3s ease 0s,bottom 0s ease 0s;
    transition:transform .3s ease 0s,bottom 0s ease 0s;
    transition:transform .3s ease 0s,bottom 0s ease 0s,-webkit-transform .3s ease 0s;
  }
  .mm.mm--offcanvas:not(.mm--open){
    bottom:100%;
    -webkit-transform:translateX(-100%);
    -ms-transform:translateX(-100%);
    transform:translateX(-100%);
    -webkit-transition-delay:0s,.6s;
    -o-transition-delay:0s,.6s;
    transition-delay:0s,.6s;
  }
  .mm.mm--right{
    left:auto;
    right:0;
  }
  .mm.mm--right:not(.mm--open){
    -webkit-transform:translateX(100%);
    -ms-transform:translateX(100%);
    transform:translateX(100%);
  }
  .mm-blocker{
    pointer-events:auto;
    display:block;
    position:fixed;
    bottom:0;
    right:0;
    background:rgba(16,24,32,.5);
    top:100%;
    z-index:9990;
    width:100%;
    opacity:0;
    -webkit-transition-property:opacity,top;
    -o-transition-property:opacity,top;
    transition-property:opacity,top;
    -webkit-transition-timing-function:ease,linear;
    -o-transition-timing-function:ease,linear;
    transition-timing-function:ease,linear;
    -webkit-transition-duration:.45s,0s;
    -o-transition-duration:.45s,0s;
    transition-duration:.45s,0s;
    -webkit-transition-delay:0s,.45s;
    -o-transition-delay:0s,.45s;
    transition-delay:0s,.45s;
  }
  .mm-blocker.mm--open{
    top:0;
    z-index:16000162;
    width:calc(100% - 80%);
    width:calc(100% - var(--mm-width));
    min-width:calc(100% - 440px);
    min-width:calc(100% - var(--mm-max-width));
    max-width:calc(100% - 200px);
    max-width:calc(100% - var(--mm-min-width));
    opacity:1;
    -webkit-transition-delay:.3s,0s;
    -o-transition-delay:.3s,0s;
    transition-delay:.3s,0s;

    background: rgba(16,24,32,.8);
    backdrop-filter: blur(9px);
    transition:opacity 2.5s ease;
  }
  .mm.mm--right{
    left:auto;
    right:0;
  }
  .mm.mm--right:not(.mm--open){
    -webkit-transform:translateX(100%);
    -ms-transform:translateX(100%);
    transform:translateX(100%);
  }
  .mm-blocker.mm--right{
    right:auto;
    left:0;
  }
  .mm ul a.responsive-icon-menu,.mm ul li.responsive-icon-menu{
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    padding: 0 .5em;
  }
  .mm ul a.responsive-icon-menu .sin-matgen-span,.mm ul li.responsive-icon-menu .sin-matgen-span{
    padding: .5em .5em .5em 0;
  }
/*-----------------------------------------------------------------------------------------------------------*/
/*SCROLL SUBMENU RESPONSIVE------------------------------------------*/
.mm.mm--offcanvas::-webkit-scrollbar-track{
  -webkit-box-shadow: inset 0 0 6px rgba(16,24,32,.5);
  /*border-radius: 10px;*/
  background-color: #F5F5F5;
}
.mm.mm--offcanvas::-webkit-scrollbar{
  background-color: #F5F5F5;
  width: .6em;
}
.mm.mm--offcanvas::-webkit-scrollbar-thumb{
  background-color: rgba(16,24,32,1); 
  background-image: -webkit-linear-gradient(45deg,
                                            rgba(255, 255, 255, .2) 25%,
                        transparent 25%,
                        transparent 50%,
                        rgba(255, 255, 255, .2) 50%,
                        rgba(255, 255, 255, .2) 75%,
                        transparent 75%,
                        transparent);
}
/*body::-webkit-scrollbar-thumb:hover{
  background-image: -webkit-linear-gradient(45deg,
                                            rgba(0, 0, 0, .2) 25%,
                        transparent 25%,
                        transparent 50%,
                        rgba(0, 0, 0, .2) 50%,
                        rgba(0, 0, 0, .2) 75%,
                        transparent 75%,
                        transparent);
}*/
.mm.mm--offcanvas::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment{
  background-color: #005c83;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.mm.mm--offcanvas::-webkit-scrollbar-button:start:decrement{
  /*background-image: url(../images/subir-scroll.png);*/
}
.mm.mm--offcanvas::-webkit-scrollbar-button:end:increment{
  /*background-image: url(../images/bajar-scroll.png);*/
}
/*FIN SCROLL SUBMENU RESPONSIVE--------------------------------------------*/
.mm .redes-desplegabler{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0 .5em;
  width: 100%;
}
.mm .redes-desplegabler h4{
  width: 100%;
}
.mm .iconos-desplegabler{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.mm .iconos-desplegabler a{
  align-items: center;
  display: flex;
  justify-content: center;
  text-align: center;
  width: 15%;
}
.mm .iconos-desplegabler a:not(:last-child):after {
    display: none;
}
.mm .iconos-desplegabler a:hover{
  color: #fff;
}
/*FIN MENU RESPONSIVE*/
/*---------------------------------------------------*/
/*FIN MENU PRINCIPLAL--------------------------------------------------------------------------------*/
main#main-principal{
  /*background-color: purple;*/
  grid-area: mainp;
  overflow-x: hidden;
  /*position: relative;*/
  z-index: 1;
  width: 100%;
}
/*PARALLAX PORTADA--------------------------------------------------------------------------------------*/
#portada h1,#portada h2{
  margin-bottom: .5em;
}
.portada-bg,.portada-bg-legal,.portada-bg-clientes,.portada-bg-blog,.portada-bg-pagos,.portada-bg-soporte,.portada-bg-tienda,
.portada-bg-contacto,.portada-bg-trabajamos,.portada-bg-metodos,.portada-bg-diseno,.portada-bg-marketing,
.portada-bg-web,.portada-bg-responsive,.portada-bg-psd,.portada-bg-eventos{
  background-color: #101820;
  background-image: url(../images/soluciones-de-automatizacion.jpg);
  background-size: cover;
  background-position: top center;
  background-attachment: fixed;
  height: 100vh;
  overflow: hidden;/*Lo que sobra lo enmascara en el contenedor del fondo*/
  position: relative;
}
.portada-bg-legal{
  background-attachment: inherit;
  background-image: url(../images/aviso-legal.jpg);
  background-position: center bottom;
  /*background-repeat: no-repeat;
  background-size: cover;*/
  height: 50vh;
}
.portada-bg-clientes{
  background-image: url(../images/clientes-y-testimonios.jpg);
  height: 75vh;
}
.portada-bg-cotizar,.portada-bg-soporte-c,.portada-bg-empleo,.portada-bg-blog,.portada-bg-ingresar,
.portada-bg-preguntas{
  background-color: rgba(0,134,191,1);
  height: 50vh;
  overflow: hidden;/*Lo que sobra lo enmascara en el contenedor del fondo*/
  position: relative;
}
.presupuesto-bg,.soporte-bg,.empleo-bg,.blog-bg,.ingresar-bg,.preguntas-bg{
  background-attachment: fixed;
  background-image: url(../images/solicitar-presupuesto.jpg);
  background-position: center top;
  background-size: cover;
  height: 100%;
  opacity: .23;
  position: absolute;
  width: 100%;
}
.soporte-bg{
  background-image: url(../images/soporte-a-clientes.jpg);
  background-position: right bottom;
}
.portada-bg-pagos{
  background-image: url(../images/pagos-en-linea.jpg);
  height: 75vh;
}
.portada-bg-soporte{
  background-image: url(../images/solicitar-soporte.jpg);
  height: 75vh;
}
.empleo-bg{
  background-image: url(../images/trabaja-en-publicoweb.jpg);
  background-position: bottom center;
}
.blog-bg{
  background-image: url(../images/blog.jpg);
  background-position: bottom center;
}
.portada-bg-tienda{
  background-image: url(../images/tienda-virtual.jpg);
  height: 100vh;
}
.portada-bg-blog{
  background-image: url(../images/blog-noticias-intelprocess.jpg);
  height: 75vh;
}
.portada-bg-contacto{
  background-image: url(../images/equipo-atencion-cliente.jpg);
  height: 75vh;
}
.portada-bg-empresa{
  background-image: url(../images/expertos-en-automatizacion.jpg);
  height: 75vh;
}
.portada-bg-servicios{
  background-image: url(../images/servicios-de-automatizacion.jpg);
  height: 75vh;
}
.portada-bg-trabajamos{
  background-image: url(../images/asi-trabajamos.jpg);
  height: 75vh;
}
.portada-bg-metodos{
  background-image: url(../images/formas-y-metodos-de-pago.jpg);
  height: 75vh;
}
.portada-bg-diseno{
  background-image: url(../images/portada-diseno-grafico.jpg);
  background-size: 200%;
  animation: movimiento 20s infinite linear alternate;
}
.portada-bg-multimedia{
  background-color: #101820;
  height: 100vh;
  overflow: hidden;/*Lo que sobra lo enmascara en el contenedor del fondo*/
  position: relative;
}
.portada-bg-marketing{
  background-image: url(../images/portada-marketing-digital.jpg);
}
.portada-bg-web{
  background-image: url(../images/portada-sitios-web.jpg);
  background-size: 100%;
  animation: movimiento 30s infinite linear alternate;
}
.portada-bg-responsive{
  background-image: url(../images/diseno-ux-ui.jpg);
}
.portada-bg-psd{
  background-image: url(../images/portada-psd-html5.jpg);
}
.portada-bg-eventos{
  background-image: url(../images/portada-eventos.jpg);
}
.video-fondos{
  left: 50%;
  min-height: 100%;
  min-width: 100%;
  position: absolute;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 1;
}
@keyframes movimiento{
    from{
        background-position: bottom left;
    }to{
        background-position: top right;
    }
}
.empleo-bg{
  background-image: url(../images/ingresar.jpg);
  background-position: bottom center;
}
.preguntas-bg{
  background-image: url(../images/preguntas-frecuentes.jpg);
  background-position: bottom center; 
}
.back-bird {
    width: 960px;
    height: 298px;
    background-image: url(../images/back-bird.png);
    background-repeat: no-repeat;
    background-position: top left;
    position: absolute;
    left: 50%;;
    margin-left: -480px;
    margin-top: -400px;
    z-index: 2;
}
.portada-txt{
  /*height: 94px;*/
  margin-top: -47px;
  position: absolute;
  text-align: center;
  top: 55%;
  width: 100%;
  z-index: 3;
}
.portada-txt-home{
  top: 42%;
}
/*.portada-txt-legal,.portada-txt-cotizar,.portada-txt-soporte,.portada-txt-empleo,.portada-txt-cursos,.portada-txt-contacto,
.portada-txt-blog,.portada-txt-ingresar,.portada-txt-trabajamos{
  margin-top: 0;
}*/
.portada-txt p{
  margin: auto;
  max-width: 1280px;
  text-align: left;
  width: 90%;
}
.portada-titulo{
  color: rgba(255,255,255,1);
  font-size: 3em;
  line-height: 1.35em;
  margin: auto;
  max-width: 1280px;
  text-align: left;
  text-shadow: 1px 1px 3px #101820;
  width: 90%;
}
.politica-title{
  text-align: center;
}
.portada-subtitulo{
  color: rgba(255,255,255,1);
  font-size: 1.5em;
  font-weight: inherit;
  text-shadow: 1px 1px 3px #101820;
}
.botones-portada{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin:  auto;
  max-width: 1280px;
  width: 90%;
}
.portada-btn{
  background-color: #ff6f00;
  border: 1px solid transparent;
  border-radius: 1em;
  color: #fff;
  padding: .65em 1.25em;
  text-align: center;
}
.portada-btn:hover{
  background-color: transparent;
  border: 1px solid #fff;
  color: #fff;
}
.pagar-btn{
  border-color: #75e590;
  color: #75e590;
  margin: .25em;
}
.pagar-btn:hover{
  background-color: #00bb2d;
  color: #fff;
}
.fotografa{
  /*background-color: rgba(16,24,32,.5);*/
  /*background-image: url(../images/fotografa.png);*/
  /*background-position: bottom right;*/
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
  right: 0;
  margin-left: -400px;
  max-width: 500px;
  position: absolute;
  width: 100%;
  z-index: 1;
  top: 48%;
}
.superpuesto{
  background: -webkit-linear-gradient(left, rgba(0, 123, 255, .85), rgba(0, 200, 83, .35));
  background-size: cover;
  background-position: top center;
  background-attachment: fixed;
  height: 100vh;
  overflow: hidden;/*Lo que sobra lo enmascara en el contenedor del fondo*/
  position: relative;
  width: 100%;
  z-index: 2;
}
.superpuesto-diseno,.superpuesto-multimedia,.superpuesto-marketing,.superpuesto-web,.superpuesto-responsive,
.superpuesto-web-azul,.superpuesto-web-azulb,.superpuesto-psd,.superpuesto-alojamiento{
  background: -webkit-linear-gradient(left, black, orange);
  height: 100vh;
  opacity: 0.77;
  position: absolute;
  width: 100%;
}
.superpuesto-multimedia{
  background: -webkit-linear-gradient(left, black, red);
  z-index: 2;
}
.superpuesto-marketing{
  background: -webkit-linear-gradient(left, black, #00BA0E);
  z-index: 2;
}
.superpuesto-web,.superpuesto-web-azul,.superpuesto-web-azulb{
  background: -webkit-linear-gradient(left, rgba(0,134,191,1), black);
  z-index: 2;
}
.superpuesto-web-azul,.superpuesto-web-azulb{
  opacity: .2;
  height: 100%;
}
.superpuesto-web-azulb{
  opacity: .5;
}
.superpuesto-responsive{
  background: -webkit-linear-gradient(left, violet, black);
  z-index: 2;
}
.superpuesto-psd{
  background: -webkit-linear-gradient(left, rgba(139,195,252,1), rgba(16,24,32,1));
  opacity: .87;
  z-index: 2
}
.superpuesto-alojamiento{
  background: -webkit-linear-gradient(left, rgba(16,24,32,.77), rgba(16,24,32,.5));
  opacity: 1;
  z-index: 2 
}
.hablar-whatsapp,.hablar-phone{
  box-shadow: 2px 2px 5px 5px rgba(255, 255, 255, .2);
  overflow: hidden;
  margin: .25em;
  position: relative;
}
.hablar-phone{
  background-color: transparent;
  /*border-width: 2px;*/
}
.hablar-whatsapp{
  background-color: transparent;
  /*border-width: 2px;*/
}
.hablar-whatsapp:hover,.hablar-phone:hover{
  border-color: rgba(0,134,191,.5);
}
.hablar-whatsapp span,.hablar-phone span{
  background-color: rgba(0,134,191,.5);
  border-radius: 50%;
  height: 170px;
  left: -100%;
  position: absolute;
  transition: all .3s;
  top: -100%;
  width: 100%;
  z-index: -1;
}
.hablar-whatsapp:hover span,.hablar-phone:hover span{
  left: -10%;
}
/*SLIDER PORTADA-------------------------------------------------------*/
.banner{
  height: 100vh;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.slider{
  height: 100vh;
  position: absolute;
  top: 0;
  width: 100%;
}
/*FIN SLIDER PORTADA*/
/*FIN PARALLAX PORTADA--------------------------------------*/
/*NOSOTROS HOME---------------------------------------------*/
#nosotros-home{
  background-color: #f5f5f5;
  padding: 4em 0;
  width: 100%;
}
.contiene-nosotros{
  align-items: flex-start;
}
.titulo-pymes{
  margin-bottom: 1em;
  text-align: center;
  width: 100%;
}
.nosotros-home-img{
  width: 47%;
}
.nosotros-home-txt{
  width: 47%;
}
/*FIN NOSOTROS HOME*/
/*SERVICIOS HOME-------------------------------------------*/
#servicios-home{
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 1), #c4e0fe);
  padding: 5em 0;
}
#servicios-home .ancho-max{
  justify-content: center;
}
#servicios-home h2{
  font-size: 3em;
  line-height: 1em;
  text-align: center;
  width: 100%;
}
.borde-titulo,.servihome-btn{
  text-align: center;
  width: 100%;
}
.bordesito{
  background: -webkit-linear-gradient(left, rgba(0, 123, 255, .3), rgba(0, 123, 255, 1));
  border-radius: .25em;
  height: 5px;
  margin: 0 auto 3em auto;
  max-width: 160px;
}
.servihome-btn{
  text-align: center;
  width: 100%;
}
.servihome-btn a{
  align-items: center;
  background-color: #fff;
  border-radius: 1em;
  box-shadow: 1px 3px 3px rgba(0, 0, 0, .1);
  display: flex;
  justify-content: center;
  margin: auto;
  max-width: 460px;
  padding: .5em 1em;
}
.servihome-btn a:hover{
  background-color: #00c853;
  color: #0d1b2a;
}
.los-servicos{
  align-items: stretch;
  margin-top: 3em;
}
.mi-servicio{
  background-color: #fff;
  border-radius: 1em;
  box-shadow: 1px 3px 10px rgba(0, 0, 0, .1);
  display: flex;
  flex-wrap: wrap;
  margin: .75em;
  padding: 1em;
  width: 30%;
}
.icono-servicio,.mi-servicio h2,.mi-servicio p{
  width: 100%;
}
.icono-servicio img{
  background-color: rgba(0, 123, 255, .2);
  border-radius: .5em;
  max-width: 45px;
  padding: .5em;
}
.mi-servicio p{
  text-align: left;
}
.soluciones-btn{
  margin-top: 3em;
}
.soluciones-btn a{
  background-color: rgba(0, 123, 255, 1);
  border: 1px solid transparent;
  color: #fff;
}
.soluciones-btn a:hover{
  background-color: transparent;
  border: 1px solid rgba(0, 123, 255, 1);
  color: rgba(0, 123, 255, 1);
}

.azul-btn{ 
  border-color: #101820; 
  border-style: solid;
  border-width: 1px;
  color: #0086bf;
  padding: .5em 1em;
}
.titulo-delgado{
  border-bottom: #666 1px dashed;
  color: #666;
}
.borde-blanco-inferior{
  border-bottom: #fff 1px dashed;
}
/*PRODUCTOS NUEVOS HOME*/
.categorias-lateral{
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 25%;
}
.categorias-repeat{
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: .5em;
  width: 100%;
}
.categoria-btn{
  /*background-color: #0086bf;*/
  border-color: #0086bf;
  border-style: solid;
  border-width: 1px;
  border-radius: .5em;
  color: #101820;
  padding: .5em;
  width: 100%;
}
.categoria-btn img{
  border-top-color: #0086bf;
  border-top-style: dashed;
  border-top-width: 1px;
  margin-top: .5em;
}
.categoria-btn i{
  color: #00c853;
}
.categoria-btn:hover i{
  color: #fff;
}
.categoria-btn span{
  background-color: #00c853;
  transition: all .3s ease-in-out;
  display: inline-block;
  padding: 3px;
  font-size: .85em;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  border-radius: 10px;
}
.categoria-btn:hover{
  background-color: #007bff;
}
.categoria-btn:hover > span{
  background-color: #fff;
  color: #0d1b2a;
}
.categoria-btn:hover > img{
  border-top-color: #fff;
}
.relacionados{
  width: auto;
}
.productos-nuevos .tarjeta-producto{
  align-items: center;
  box-shadow: 0 0 8px 8px rgba(0, 0, 0, .1);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  background-color: #fff;
  border-color: #b5b5b5;
  border-style: solid;
  border-width: 1px;
  border-radius: 1em;
  height: 360px;
  margin: .7em .75em 3em .75em;
  overflow: hidden;
  padding: .5em;
  position: relative;
  width: 28%;
}
.productos-nuevos .tarjeta-producto:before{
  background-color: #e5e5e5;
  clip-path: circle(130px at 80% 20%);
  content: '';
  height: 100%;
  left: 0;
  position: absolute;
  transition: .5s ease-in-out;
  top: 0;
  width: 100%;
}
.productos-nuevos .tarjeta-producto:hover:before{
  background-color: rgba(0,134,191,1);
  clip-path: circle(280px at 80% -20%);
}
.productos-nuevos .tarjeta-producto:after{
  color: rgba(0, 0, 0, .1);
  content: 'P\00da BLICO WEB';
  font-size: 1.85em;
  font-weight: bold;
  left: 0%;
  position: absolute;
  text-align: center;
  top: 45%;
  width: 100%;
  z-index: 2;
}
.productos-home{
  justify-content: center;
  margin: auto;
  max-width: 1280px;
  width: 95%;
}
.productos-home .tarjeta-producto{
  width: 20%;
}
/*ELEMENTO DEL CARRUSEL--------------------------*/
.carrusel-relacionados,.carrusel-relacionadosb,.carrusel-relacionadosc{
  margin: auto;
  max-width: 1280px;
  padding: 2em 0;
  width: 90%;
}
.carrusel-relacionadosb,.carrusel-relacionadosc,.carrusel-relacionadosd{
  display: none;
}
.relacionados .tarjeta-producto{
  width: 100%;
}
/*FIN DEL ELEMENTO DEL CARRUSEL*/
.productos-nuevos .tarjeta-producto .tarjetap-img{
  position: absolute;
  text-align: center;
  top: 50%;
  transform: translateY(-50%);
  transition: .5s;
  width: 90%;
  z-index: 1;
}
.productos-nuevos .tarjeta-producto:hover .tarjetap-img{
  top: .5em;
  transform: translateY(0%);
}
.productos-nuevos .tarjeta-producto .tarjetap-img img{
  /*left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%,-50%) rotate(-25deg);
  width: 200px;*/
}
.productos-nuevos .tarjeta-producto .tarjeta-txt{
  bottom: 0;
  height: 84px;
  position: absolute;
  text-align: center;
  transition: 1s;
  width: 100%;
  z-index: 3;
}
.productos-nuevos .tarjeta-producto:hover .tarjeta-txt{
  height: 180px;
}
.productos-nuevos .tarjeta-producto .tarjeta-txt div:first-child{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto .15em auto;
  position: relative;
  width: 100%;
}
.productos-nuevos .tarjeta-producto .tarjeta-txt div a{
  background-color: rgba(16,24,32,.8);
  border-radius: .25em;
  color: #fff;
  /*font-family: RobotoCondensed;*/
  font-size: 1em;
  letter-spacing: 1px;
  padding: .1em .25em;
}
.productos-nuevos .tarjeta-producto .tarjeta-txt div:last-child{
  display: flex;
  width: 100%;
}
.productos-nuevos .tarjeta-producto .tarjeta-txt div span{
  background-color: rgba(255,255,255,.8);
  border-radius: .25em;
  color: rgba(0, 0, 0, 1);
  font-size: 1.2em;
  margin: auto;
  padding: .1em .25em;
}
.productos-nuevos .tarjeta-producto .verp-btn{
  bottom: 1em;
  display: flex;
  justify-content: space-between;
  margin-top: .5em;
  opacity: 0;
  position: absolute;
  transform: translateY(50px);
  transition: .5s;
  width: 90%;
  z-index: 4;
}
.productos-nuevos .tarjeta-producto .verp-btn a{
  background-color: #e5e5e5;
  border-color: #c5c5c5;
  border-style: solid;
  border-width: 1px;
  border-radius: .25em;
  box-shadow: 0 4px 8px rgba(0, 0, 0, .2);
  color: rgba(0, 0, 0, 1);
  font-size: .9em;
  font-weight: bold;
  padding: .5em .85em;
}
.productos-nuevos .tarjeta-producto .verp-btn a:hover{
  background-color: rgba(0,134,191,1);
}
.productos-nuevos .tarjeta-producto:hover .verp-btn{
  opacity: 1;
  transform: translateY(0);
  transition-delay: .75s;
}
.padding-arriba{
  padding: 4em 0 1em 0;
}
.mas-productos{
  display: flex;
  justify-content: center;
  width: 100%;
}
.mas-productos a{
  background-color: #101820;
  border-color: #101820;
  border-radius: 1em 1em 2em .5em;
  border-style: solid;
  border-width: 1px;
  color: #fff;
  padding: 0.8em 2em;
  text-shadow: 1px 1px 1px rgb(0 0 0 / 30%);
}
.mas-productos a:hover{
  background-color: rgba(0,134,191,1);
  border-color: rgba(0,134,191,1);
}
/*FIN PRODUCTOS NUEVOS HOME*/
/*SOCIOS HOME--------------------------------------------------------------------*/
#socios-home{
  background-attachment: fixed;
  /*background-color: #0086bf;*/
  background-image: url(../images/transformacion-digital.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-bottom: 10px solid #007bff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6em 0;
  position: relative;
  width: 100%;
}
.contenedor-socios{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: auto;
  max-width: 1280px;
  width: 90%;
  z-index: 2;
}
.superpuesto-socios{
  background: -webkit-linear-gradient(left, rgba(0, 123, 255, .5), rgba(13, 27, 42, .5));
  height: 100%;
  position: absolute;
  z-index: 1;
  width: 100%;
}
.contenedor-socios h2,.contenedor-agenda h2{
  font-size: 3em;
  font-style: italic;
  text-align: center;
  width: 100%;
}
.contenedor-socios p,.contenedor-socios blockquote,.contenedor-agenda p{
  color: #fff;
  text-align: center;
  width: 100%;
}
.contenedor-socios blockquote{
  font-style: italic;
  font-weight: bold;
  margin-bottom: 1.5em;
}
/*FIN SOCIOS HOME----------------------------------------------------------------*/
/*AGENDA HOME--------------------------------------------------------------------*/
#agenda-home{
  background-color: #0d1b2a;
  padding: 3em 0;
  width: 100%;
}
.contenedor-agenda{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: auto;
  width: 90%;
}
.agenda-btnhome{
  background-color: transparent;
  border: 1px solid #007bff;
  border-radius: 1em;
  color: #007bff;
  padding: .65em 1.25em;
}
.agenda-btnhome:hover{
  background-color: #007bff;
  color: #fff;
}
/*FIN AGENDA HOME----------------------------------------------------------------*/
#footer-invisible{
  grid-area: invisible;
  position: relative;
  z-index: 0;
  padding: 0;
  background: transparent;
  min-height: 250px;
}
footer#footer-principal{
  align-items: center;
  /*background-color: rgba(0,134,191,1);*/
  background-image: url(../images/textura-papel.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  justify-content: center;
  bottom: 0;
  color: rgba(16,24,32,1);
  grid-area: footerp;
  padding: 2em 0 1em 0;
  position: fixed;
  overflow: hidden;
  /* left: 50%; */
  /*opacity: 0;*/
  width: 100%;
  z-index: 0;
}
.superpuesto-footer{
  background-color: #0d1b2a;
  height: 100%;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}
footer#footer-principal h3,footer#footer-principal h4{
  color: rgba(0,134,191,1);
  text-shadow: none;
}
footer#footer-principal p{
  color: rgba(255, 255, 255, .5);
  font-size: .9em;
}
.visible-invisible{
  display: none;
}
/*LEGAL------------------------------------------------------------------------------*/
#contenedor-avisos-legales,#contenedor-clientes,#contenedor-cotizar,#contenedor-cotizar-di,#contenedor-pagos,
#contenedor-soporte,#contenedor-empleo,#contenedor-soporte-cliente,#contenedor-contacto,#contenedor-ingresar,
#contenedor-trabajamos,#contenedor-formas,#contenedor-metodos,#contenedor-preguntas,#contenedor-diseno,
#contenedor-multimedia,#contenedor-marketing,#contenedor-web,#contenedor-responsive,#contenedor-psd-html{
  background-color: #fff;
  padding: 3em 0;
  width: 100%;
}
#contenedor-avisos-legales {
    background-color: #0d1b2a;
}
#contenedor-formas h2,#contenedor-metodos h2,#contenedor-preguntas h2{
  font-size: 3em;
  margin-bottom: 2em;
  text-align: center;
  width: 100%;
}
#contenedor-cotizar-di{
  padding: 3em 0 6em 0;
}
#contenedor-pagos,#contenedor-soporte,#contenedor-contacto,#contenedor-metodos{
  padding-bottom: 7em;
  padding-top: 4em;
  position: relative;
}
#contenedor-pagos{
  border-bottom-color: #666;
  border-bottom-style: dashed;
  border-bottom-width: 1px;
  padding-bottom: 1em;
}
#contenedor-soporte,#contenedor-contacto,#contenedor-metodos{
  padding-bottom: 3em;
}
#contenedor-contacto,#contenedor-diseno,#contenedor-marketing{
  background-color: #e5e5e5;
}
#contenedor-metodos{
  background-color: #0086bf;
}
#contenedor-multimedia{
  background-color: #101820;
  color: rgba(255,255,255,.7);
}
.aviso-aside{
  display: grid;
  grid-gap: 4em;
  grid-template-areas: 
    "aviso";
  grid-template-columns: 1fr;
  margin: auto;
  max-width: 900px;
  width: 90%;
}
.aviso-txt{
  grid-area: aviso;
  width: 100%;
}
.aviso-img{
  grid-area: aside-legal;
}
.division-legales{
  border-color: #777;
  border-style: dashed;
  border-width: 1px;
  margin: 1em 0;
}
/*FIN LEGAL*/
/*EMPRESA------------------------------------------------------------------------------*/
#contenedor-empresa,#contenedor-misionvision,#valores,#contenedor-beneficios{
  background-color: #e5e5e5;
  padding: 4em 0 10em 0;
  position: relative;
  width: 100%;
}
#contenedor-empresa .ancho-max{
  align-items: center;
}
#contenedor-empresa h2,#contenedor-misionvision h2,#contenedor-servicios h2{
  margin-bottom: 1em;
  text-align: center;
  width: 100%;
}
.empresa-txt,.empresa-img{
  width: 47%;
}
.empresa-img{
  border: 3px double #007bff;
  border-radius: 80px 37px 19px 49px / 31px 49px 27px 7px;
  overflow: hidden;
  position: relative;
}
.empresa-img img{
  border-radius: 80px 37px 19px 49px / 31px 49px 27px 7px;
  object-fit: cover; /* Asegura que la imagen cubra el contenedor sin deformarse */
  transition: transform 0.4s ease-in-out;
}
.empresa-img:hover img{
  transform: scale(1.2) rotate(5deg); /* Zoom y rotación al pasar el cursor */
}
/*MISIÓN Y VISIÓN----------------------------------------------------------------------*/
#contenedor-misionvision{
  background-color: #fff;
  padding: 4em 0;
}
.mision,.vision{
  width: 47%;
}
/*VALORES------------------------------------------------------------------------------*/
#valores,#contenedor-beneficios{
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 1), #c4e0fe);
  padding: 10em 0 4em 0;
}
.los-valores,.la-metodologia{
  width: 47%;
}
.serviempresa-btn{
  text-align: left;
}
.serviempresa-btn a{
  margin: 2em 0 0 0;
}
.los-beneficios{
  width: 100%;
}
/*SERVICIOS----------------------------------------------------------------------------*/
#contenedor-servicios{
  background-color: #ddd;
  padding: 4em 0 0 0;
  width: 100%;
}
.servicios-txt{
  text-align: center;
  width: 100%;
}
#servicios{
  background-color: #ddd;
  padding: 0 0 4em 0;
  width: 100%;
}
/*-------------------------------*/
.shell{
  padding:80px 0;
}
.wsk-cp-product{
  background:#fff;
  padding:15px;
  border-radius:6px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  position:relative;
  margin:20px auto;
}
.wsk-cp-img{
  position:absolute;
  top:5px;
  left:50%;
  transform:translate(-50%);
  -webkit-transform:translate(-50%);
  -ms-transform:translate(-50%);
  -moz-transform:translate(-50%);
  -o-transform:translate(-50%);
  -khtml-transform:translate(-50%);
  width: 100%;
  padding: 15px;
  transition: all 0.2s ease-in-out;
}
.wsk-cp-img img{
  width:100%;
  transition: all 0.2s ease-in-out;
  border-radius:6px;
}
.wsk-cp-product:hover .wsk-cp-img{
  top:-40px;
}
.wsk-cp-product:hover .wsk-cp-img img{
  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
}
.wsk-cp-text{
  padding-top:70%;
}
.wsk-cp-text .category{
  text-align:center;
  font-size:14px;
  font-weight:bold;
  padding:5px;
  margin-bottom:45px;
  position:relative;
  transition: all 0.2s ease-in-out;
}
.wsk-cp-text .category > *{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  -khtml-transform: translate(-50%,-50%);
    
}
.wsk-cp-text .category > a{
  padding: 12px 30px;
  border: 1px solid #0263cc;
  background:#007bff;
  color:#fff;
  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
  border-radius:27px;
  transition: all 0.05s ease-in-out;
  width: 74%;
  
}
.wsk-cp-text .category > a:hover{
  text-decoration: none;
}
.wsk-cp-product:hover .wsk-cp-text .category > a{
  border-color:#ddd;
  box-shadow: none;
  padding: 11px 28px;
}
.wsk-cp-product:hover .wsk-cp-text .category{
  margin-top: 0px;
}
.wsk-cp-text .title-product{
  text-align:center;
}
.wsk-cp-text .title-product h3{
  font-size:20px;
  font-weight:bold;
  margin:15px auto;
  overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  width:100%;
}
.wsk-cp-text .description-prod p{
  margin:0;
}
/* Truncate */
.wsk-cp-text .description-prod {
  text-align:center;
  width: 100%;
  /*height:62px;*/
  overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  margin-bottom:15px;
}
.card-footer{
  padding: 25px 0 5px;
  border-top: 1px solid #ddd;
}
.card-footer:after, .card-footer:before{
  content:'';
  display:table;
}
.card-footer:after{
  clear:both;
}

.card-footer .wcf-left{
  float:left;
  
}

.card-footer .wcf-right{
  float:right;
}

.price{
  font-size:18px;
  font-weight:bold;
}

a.buy-btn{
  display:block;
  color:#212121;
  text-align:center;
  font-size: 18px;
  width:35px;
  height:35px;
  line-height:35px;
  border-radius:50%;
  border:1px solid #212121;
  transition: all 0.2s ease-in-out;
}
a.buy-btn:hover , a.buy-btn:active, a.buy-btn:focus{
  border-color: #FF9800;
  background: #FF9800;
  color: #fff;
  text-decoration:none;
}
.wsk-btn{
  display:inline-block;
  color:#212121;
  text-align:center;
  font-size: 18px;
  transition: all 0.2s ease-in-out;
  border-color: #FF9800;
  background: #FF9800;
  padding:12px 30px;
  border-radius:27px;
  margin: 0 5px;
}
.wsk-btn:hover, .wsk-btn:focus, .wsk-btn:active{
  text-decoration:none;
  color:#fff;
}  
.red{
  color:#F44336;
  font-size:22px;
  display:inline-block;
  margin: 0 5px;
}
@media screen and (max-width: 991px) {
  .wsk-cp-product{
    margin:40px auto;
  }
  .wsk-cp-product .wsk-cp-img{
  top:-40px;
}
.wsk-cp-product .wsk-cp-img img{
  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
}
  .wsk-cp-product .wsk-cp-text .category > a{
  border-color:#ddd;
  box-shadow: none;
  padding: 11px 28px;
}
.wsk-cp-product .wsk-cp-text .category{
  margin-top: 0px;
}
a.buy-btn{
  border-color: #FF9800;
  background: #FF9800;
  color: #fff;
}
}
/*CLIENTES Y PROYECTOS-----------------------------------------------------------------*/
.menu-galeria{
  display: flex;
  justify-content: center;
  margin-bottom: 3em;
}
.items{
  display: flex;
  max-width: 720px;
  width: 100%;
  justify-content: space-between;
}
.items span{
  padding: 7px 25px;
  font-size: 18px;
  font-weight: 500;
  cursor: pointer;
  color: #0086bf;
  border-radius: .5em;
  border: 2px solid #0086bf;
  transition: all 0.3s ease;
}
.items span.active,
.items span:hover{
  color: #fff;
  background: #0086bf;
}

.gallery{
  display: flex;
  flex-wrap: wrap;
  margin-top: 30px;
}
.gallery .image{
  /*width: calc(100% / 4);*/
  /*padding: 7px;*/
}
.gallery .image span{
  display: flex;
  width: 100%;
  overflow: hidden;
}
.gallery .image img{
  width: 100%;
  vertical-align: middle;
  transition: all 0.3s ease;
}
.gallery .image:hover img{
  transform: scale(1.1);
}
.gallery .image.hide{
  display: none;
}
.gallery .image.show{
  animation: animate 0.4s ease;
}
@keyframes animate {
  0%{
    transform: scale(0.5);
  }
  100%{
    transform: scale(1);
  }
}

.preview-box{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.9);
  background: #fff;
  max-width: 700px;
  width: 100%;
  z-index: 5;
  opacity: 0;
  pointer-events: none;
  border-radius: 3px;
  padding: 0 5px 5px 5px;
  box-shadow: 0px 0px 15px rgba(16,24,32,0.2);
}
.preview-box.show{
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, -50%) scale(1);
  transition: all 0.3s ease;
}
.preview-box .details{
  padding: 13px 15px 13px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.details .title{
  display: flex;
  font-size: 18px;
  font-weight: 400;
}
.details .title p{
  font-weight: 500;
  margin-left: 5px;
}
.details .icon{
  color: #007bff;
  font-style: 22px;
  cursor: pointer;
}
.preview-box .image-box{
  width: 100%;
  display: flex;
}
.image-box img{
  width: 100%;
  border-radius: 0 0 3px 3px;
}
.shadow{
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: 2;
  display: none;
  background: rgba(16,24,32,.4);
}
.shadow.show{
  display: block;
}

@media (max-width: 1000px) {
  .gallery .image{
    /*width: calc(100% / 3);*/
  }
}
@media (max-width: 800px) {
  .gallery .image{
    /*width: calc(100% / 2);*/
  }
}
@media (max-width: 700px) {
  .menu-galeria .items{
    max-width: 600px;
  }
  .menu-galeria .items span{
    padding: 7px 15px;
  }
}
@media (max-width: 600px) {
  .menu-galeria .items{
    flex-wrap: wrap;
    justify-content: center;
  }
  .menu-galeria .items span{
    margin: 5px;
  }
  .gallery .image{
    width: 100%;
  }
}
.clientes-mini{
  display: grid;
  grid-gap: 3em;
  grid-template-columns: repeat(4, 1fr);
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.pagos-mini{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.pagos-img,.pagos-txt{
  text-align: center;
  width: 100%;
}
.consulta-pago-btn{
  width: 100%;
}
.logos-pago{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.single-album{
  /*border-radius: 6em 1em 1.5em 1.2em;*/
  /*border: 3px solid #0086bf;*/
  box-shadow: 3px 3px 12px rgba(0, 0, 0, .5);
  position: relative;
  overflow: hidden;
}
.album-img{
  position: relative;
  overflow: hidden;
}
.album-img img{
  width: 100%;
  transition: .4s;
}
.single-album:hover .album-img img{
  transform: scale(1.5,1.5);
}
.album-content{
  align-items: center;
  background-color: rgba(0,134,191,.8);
  bottom: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  height: 88px;
  overflow: hidden;
  position: absolute;
  /*text-align: center;*/
  transition: all .4s;
  width: 100%;
}
.single-album:hover .album-content{
  background-color: rgba(16,24,32,.8);
  height: 100%
}
.album-btn{
  cursor: pointer;
  padding: 0.5em 1em;
}
.album-info{
  display: flex;
  flex-wrap: wrap;
  padding: .5em;
  transition: all .5s;
  width: 100%;
}
.album-info h2{
  color: #fff;
  font-size: 1.15em;
  margin: 0;
  text-align: center;
  width: 100%;
  /*text-transform: uppercase;*/
}
.pa-boton-portafolio{
  text-align: center;
  width: 100%;
}
.single-album:hover .album-info h2{
  color: rgba(0,134,191,1);
}
.album-info h3,.album-info h4{
  color: #fff;
  font-size: .9em;
  font-weight: normal;
  margin: 0 0 .25em 0;
  text-align: center;
  width: 100%;
}
.album-info h3{
  margin: 0 0 1em 0;
}
.album-info h4{
  font-weight: bold;
}
.album-info p{
  color: rgba(255,255,255,.75);
  font-size: .85em;
  text-align: center;
  width: 100%;
}
.description{
  font-size: .9em;
}
/*FIN CLIENTES Y PROYECTOS*/
/*COTIZADORES------------------------------------------------------------------------------------------*/
.contiene-cotizar-di{
  border-bottom-color: #777;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  display: flex;
  flex-wrap: wrap;
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.cotizar-di-txt,.cotizar-di-form{
  width: 100%;
}
.cotizar-di-form{
  margin-top: 3em;
}

.cotizar-checkbox{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: .5em;
  width: 100%;
}
.cotizar-checkbox-item{
  align-items: center;
  background-color: #fff;
  border-color: rgba(0,134,191,1);
  border-radius: .2em;
  border-style: solid;
  border-width: 1px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: .2em;
  position: relative;
}
.cotizar-checkbox-item label{
  background-color: #fff;
  border-radius: .2em;
  cursor: pointer;
  font-size: .85em;
  font-weight: normal;
  padding: .2em 2.3em .2em .7em;
  text-align: left;
  overflow: hidden;
  position: relative;
  transition: color 200ms ease-in;
  z-index: 2;
}
.cotizar-checkbox-item label:before{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  content: "";
  background-color: rgba(0,134,191,1);
  color: rgba(255, 255, 255, 1);
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) scale3d(1, 1, 1);
          transform: translate(-50%, -50%) scale3d(1, 1, 1);
  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
  opacity: 0;
  z-index: -1;
}
.cotizar-checkbox-item label:after{
  /*width: 1em;
  height: 1em;*/
  color: #fff;
  content: "\f00c";
  border: 2px solid #d1d7dc;
  background-color: #fff;
  /*background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");*/
  background-repeat: no-repeat;
  background-position: 2px 3px;
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  border-radius: 50%;
  margin-left: .5em;
  z-index: 2;
  position: absolute;
  right: 10px;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
  transition: all 200ms ease-in;
}
.cotizar-checkbox-item input:checked ~ label{
  color: #fff;
}
.cotizar-checkbox-item input:checked ~ label.activo-acepto{
  color: rgba(255,255,255,.8);
}
.cotizar-checkbox-item input:checked ~ label:before{
  align-items: center;
  display: flex;
  justify-content: center;
  -webkit-transform: translate(-50%, -50%) scale3d(56, 56, 1);
          transform: translate(-50%, -50%) scale3d(56, 56, 1);
  opacity: 1;
}
.cotizar-checkbox-item input:checked ~ label:after{
  align-items: center;
  background-color: rgba(0,134,191,1);
  border-color: transparent;
  display: flex;
  font-size: 1.15em;
  justify-content: center;
  /*padding: .25em;*/
}
.cotizar-checkbox-item input{
  width: 18px;
  height: 18px;
  order: 1;
  z-index: 2;
  position: absolute;
  /*right: 30px;*/
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
  /*visibility: hidden;*/
}
/*--------------------------------------------------------------*/
/* ///  END DECORATION CSS  ///  */
.icon_select_mate {
  position: absolute;
  top: 33%;
  right: 1em;
  font-size: 1em;
  height: 22px;
  transition: all 275ms;
}
.select_mate {
  position: relative;
  float: left;
  /*min-width: 300px;*/
  width: 100%;
  margin-top: .5em;
  /*min-height: 60px;*/
  color: #777;
  font-weight: 300;
  background-color: #fff;
  border-color: #dedede;
  border-style: solid;
  border-width: 1px;
  box-shadow: 1px 2px 10px -2px rgba(0, 0, 0, 0.3);
  border-radius: 3px;
  transition: all 375ms ease-in-out;
  /* Oculto el elemento select */
}
.select_mate select {
  position: absolute;
  overflow: hidden;
  height: 0px;
  opacity: 0;
  z-index: -1;
}
.cont_list_select_mate {
  position: relative;
  float: left;
  width: 100%;
}
.cont_select_int {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 999;
  overflow: hidden;
  height: 0px;
  width: 100%;
  background-color: #fff;
  padding: 0px;
  margin-bottom: 0px;
  margin-top: 0px;
  border-radius: 0px 0px 3px 3px;
  box-shadow: 1px 4px 10px -2px rgba(0, 0, 0, 0.2);
  transition: all 375ms ease-in-out;
}
.cont_select_int li {
  position: relative;
  float: left;
  font-size: .85em;
  width: 100%;
  border-bottom: 1px solid #E0E0E0;
  background-color: #F5F5F5;
  list-style-type: none;
  padding: 10px 2%;
  margin: 0px;
  transition: all 275ms ease-in-out;
  display: block;
  cursor: pointer;
}
.cont_select_int li:last-child {
  border-radius: 3px;
  border-bottom: 0px;
}
.cont_select_int li:hover {
  background-color: rgba(0,134,191,1);
  color: rgba(255,255,255,1);
}
.cont_select_int .active {
  background-color: #DEDEDE;
}
/* etiqueta <p> con la opcion selecionada  */
.selecionado_opcion {
  padding: .7rem 1rem;
  width: 96%;
  display: block;
  margin: 0px;
  cursor: pointer;
}
/*Otro checkox del presupuesto*/
.cbx {
  display: flex;
  margin: auto;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
}
.cbx span {
  display: inline-block;
  vertical-align: middle;
  transform: translate3d(0, 0, 0);
}
.cbx span:first-child {
  min-width: 20px;
  position: relative;
  width: 20px;
  height: 20px;
  border-radius: 3px;
  transform: scale(1);
  vertical-align: middle;
  border: 1px solid #9098A9;
  transition: all 0.2s ease;
}
.cbx span:first-child div {
  color: #fff;
  font-weight: normal;
  position: absolute;
  top: 0;
  left: 0;
  fill: none;
  stroke: #FFFFFF;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 16px;
  stroke-dashoffset: 16px;
  transition: all 0.3s ease;
  transition-delay: 0.1s;
  transform: translate3d(0, 0, 0);
}
.cbx span:first-child:before {
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0,134,191,1);
  display: block;
  transform: scale(0);
  opacity: 1;
  border-radius: 50%;
}
.cbx span:last-child {
  padding-left: 8px;
}
.cbx:hover span:first-child {
  border-color: rgba(0,134,191,1);
}
.inp-cbx:checked + .cbx span:first-child {
  background: rgba(0,134,191,1);
  border-color: rgba(0,134,191,1);
  animation: wave 0.4s ease;
}
.inp-cbx:checked + .cbx span:first-child svg {
  stroke-dashoffset: 0;
}
.inp-cbx:checked + .cbx span:first-child:before {
  transform: scale(3.5);
  opacity: 0;
  transition: all 0.6s ease;
}
@keyframes wave {
  50% {
    transform: scale(0.9);
  }
}
/*Fin del otro checkbox del presupuesto*/
.politica-presupuesto{
  color: rgba(0,134,191,1);
  font-weight: bold;
}
.politica-presupuesto:hover{
  color: rgba(16,24,32,1);
}
.politica-presu-size{
  /*font-size: .85em;*/
}
.politica-presupuesto-b{
  color: rgba(16,24,32,1);
  font-weight: bold;
}
.politica-presupuesto-b:hover{
  text-decoration: underline;
}
/*NUEVO FORMULARIO DE COTIZACION--------------------------------------------*/
#presupuesto-form{
  align-items: center;
  margin-bottom: 2em;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.secciones-form{
  align-items: center;
  background-color: #eee;
  border-color: rgba(16,24,32,.3);
  border-radius: 5em 0 2em 5em;
  border-style: solid;
  border-width: 1px;
  color: #101820;
  display: flex;
  flex-wrap: wrap;
  font-family: RobotoCondensedLight;
  font-weight: normal;
  justify-content: flex-start;
  /*margin-bottom: 1em;*/
  padding: 0 .5rem;
  width: 100%;
}
.campos-form,.etiqueta-campo-form{
  /*align-items: center;*/
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.requerimientos-form{
  justify-content: flex-start;
}
.campos-form{
  margin: 1em 0;
}
.alinear-capcha{
  align-items: center;
}
.alinear-capcha-b{
  align-items: flex-end;
}
.etiqueta-campo-form{
  margin-top: 1rem;
  margin-bottom: 1rem;
  position: relative;
}
.acepto-hablar{
  margin-bottom: 0;
  margin-top: 0;
}
.etiqueta-campo-form input,.etiqueta-campo-form textarea,.etiqueta-campo-form select{
  font-family: "RobotoCondensed";
}
.etiqueta-campo-form input::placeholder,.etiqueta-campo-form textarea::placeholder {
  color: #9e9e9e;
  position: absolute;
  top: 0;
  left: 0;
  font-size: 1rem;
  cursor: text;
  -webkit-transition: color .2s ease-out, -webkit-transform .2s ease-out;
  transition: color .2s ease-out, -webkit-transform .2s ease-out;
  transition: transform .2s ease-out, color .2s ease-out;
  transition: transform .2s ease-out, color .2s ease-out, -webkit-transform .2s ease-out;
  -webkit-transform-origin: 0% 100%;
          transform-origin: 0% 100%;
  text-align: initial;
  -webkit-transform: translateY(29px);
          transform: translateY(29px);
}
.etiqueta-campo-form input:focus::placeholder,.etiqueta-campo-form textarea:focus::placeholder {
  -webkit-transform: translateY(-2px) scale(0.75);
          transform: translateY(-2px) scale(0.75);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
}
.etiqueta-campo-form input:focus::placeholder.active,.etiqueta-campo-form textarea:focus::placeholder.active {
  -webkit-transform: translateY(-2px) scale(0.75);
          transform: translateY(-2px) scale(0.75);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
}
.helper-text {
  display: flex;
  position: relative;
  min-height: 18px;
  display: block;
  font-size: 12px;
  /*color: rgba(16,24,32,.54);*/
  color: red;
  width: 100%;
}
.helper-text::after {
  opacity: 1;
  position: relative;
  top: 0;
  left: 0;
}
.uno-form{
  width: 100%;
}
.dos-form{
  width: 45%;
}
.tres-form{
  width: 30%;
}
.cuatro-form{
  width: 20%;
}
.numeracion-form{
  align-items: center;
  border-radius: 50%;
  color: #fff;
  background-color: rgba(0,134,191,1);
  display: flex;
  flex-wrap: wrap;
  height: 2em;
  justify-content: center;
  margin-right: .5rem;
  padding: 3px;
  width: 2em;
}
input:not([type]), input[type=text]:not(.browser-default), input[type=password]:not(.browser-default), 
input[type=email]:not(.browser-default), input[type=url]:not(.browser-default), 
input[type=time]:not(.browser-default), input[type=date]:not(.browser-default), 
input[type=datetime]:not(.browser-default), input[type=datetime-local]:not(.browser-default), 
input[type=tel]:not(.browser-default), input[type=number]:not(.browser-default), 
/*input[type=search]:not(.browser-default), */textarea.materialize-textarea, textarea:not(.browser-default),
select:not(.browser-default){
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #9e9e9e;
  border-radius: 0;
  outline: none;
  height: 3.5rem;
  width: 100%;
  font-size: 16px;
  margin: 0 0 8px 0;
  padding: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-transition: border .3s, -webkit-box-shadow .3s;
  transition: border .3s, -webkit-box-shadow .3s;
  transition: box-shadow .3s, border .3s;
  transition: box-shadow .3s, border .3s, -webkit-box-shadow .3s;
}
textarea.materialize-textarea, textarea:not(.browser-default){
  border-top: #9e9e9e solid 1px;
  border-left: #9e9e9e solid 1px;
  border-right: #9e9e9e solid 1px;
  box-sizing: border-box;
  height: 90%;
  /*min-height: 160px;*/
  padding: 1em;
  resize: none;
}
select{
  display: block;
  /*font-size: 16px;
  font-weight: 400;*/
  color: #9e9e9e;
  /*line-height: 1.3;
  padding: .4em 1.4em .3em .8em;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  border-bottom: 1px solid #9e9e9e;
  box-shadow: 0 1px 0 1px rgba(16,24,32,.03);*/
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E')/*,
    linear-gradient(to bottom, #ffffff 0%,#f7f7f7 100%)*/;
  background-repeat: no-repeat, repeat;
  background-position: right .7em top 50%, 0 0;
  background-size: .65em auto, 100%;
}
textarea.describe-pro,textarea.mensaje-contact{
  border-top: 0;
  border-left: 0;
  border-right: 0;
  box-sizing: border-box;
  height: auto;
  margin-bottom: 8px;
  padding: 1em 0;
  resize: none;
}
.agrupa-select{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.agrupa-select div{
  width: 100%;
}
.waves-effect {
  position: relative;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  vertical-align: middle;
  z-index: 1;
  -webkit-transition: .3s ease-out;
  transition: .3s ease-out;
}
.btn-presupuesto{
  text-decoration: none;
  color: #fff;
  background-color: rgba(0,134,191,1);
  text-align: center;
  letter-spacing: .5px;
  -webkit-transition: color .2s ease-out;
  transition: color .2s ease-out;
  cursor: pointer;

  border: none;
  border-radius: 2px;
  display: inline-block;
  /*height: 36px;
  line-height: 36px;*/
  padding: 1.25em 1em;
  text-transform: uppercase;
  /*vertical-align: middle;*/
  -webkit-tap-highlight-color: transparent;
  width: 100%;
}
.btn-presupuesto:hover{
  color: rgba(255,255,255,.5);
}
.btn-presupuestob{
  background-color: rgba(0,150,70,1);
}
.card-panel{
  -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}
.card-panel {
  -webkit-transition: -webkit-box-shadow .25s;
  transition: -webkit-box-shadow .25s;
  transition: box-shadow .25s;
  transition: box-shadow .25s, -webkit-box-shadow .25s;
  padding: 24px;
  margin: 0.5rem 0 1rem 0;
  border-radius: 2px;
  background-color: #fff;
  width: 100%;
}
.green {
    background-color: #4CAF50 !important;
}
progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}
.progress {
  position: relative;
  height: 4px;
  display: block;
  width: 100%;
  background-color: #acece6;
  border-radius: 2px;
  margin: 0.5rem 0 1rem 0;
  overflow: hidden;
}
.progress .determinate {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  background-color: #26a69a;
  -webkit-transition: width .3s linear;
  transition: width .3s linear;
}
.progress .indeterminate {
  background-color: #26a69a;
}
.progress .indeterminate:before {
  content: '';
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
          animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
}
.progress .indeterminate:after {
  content: '';
  position: absolute;
  background-color: inherit;
  top: 0;
  left: 0;
  bottom: 0;
  will-change: left, right;
  -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
          animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
  -webkit-animation-delay: 1.15s;
          animation-delay: 1.15s;
}
@-webkit-keyframes indeterminate {
  0% {
    left: -35%;
    right: 100%;
  }
  60% {
    left: 100%;
    right: -90%;
  }
  100% {
    left: 100%;
    right: -90%;
  }
}
@keyframes indeterminate {
  0% {
    left: -35%;
    right: 100%;
  }
  60% {
    left: 100%;
    right: -90%;
  }
  100% {
    left: 100%;
    right: -90%;
  }
}
@-webkit-keyframes indeterminate-short {
  0% {
    left: -200%;
    right: 100%;
  }
  60% {
    left: 107%;
    right: -8%;
  }
  100% {
    left: 107%;
    right: -8%;
  }
}
@keyframes indeterminate-short {
  0% {
    left: -200%;
    right: 100%;
  }
  60% {
    left: 107%;
    right: -8%;
  }
  100% {
    left: 107%;
    right: -8%;
  }
}
.white-text {
  color: #FFFFFF !important;
}
.concentimiento-presupuesto{
  margin-bottom: 2em;
}
/*NUEVOS CAMPOS SELECT.....................................................*/
.select-box {
  position: relative;
  display: flex;
  width: 100%;
  flex-direction: column;
  font-size: .9em;
}
.select-box .options-container {
  background: #2f3640;
  color: #f5f6fa;
  max-height: 0;
  width: 100%;
  opacity: 0;
  transition: all 0.4s;
  border-radius: 0 0 8px 8px;
  overflow: hidden;
  order: 1;
  position: absolute;
  z-index: 100;
}
.selected {
  background: #2f3640;
  border-radius: 8px;
  margin-bottom: 8px;
  color: #f5f6fa;
  position: relative;
  order: 0;
  z-index: 0;
}
.selected::after {
  content: "";
  background: url("../images/bajar-scroll.png");
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  height: 100%;
  width: 32px;
  right: 10px;
  top: 5px;
  transition: all 0.4s;
}
.select-box .options-container.active {
  max-height: 240px;
  opacity: 1;
  overflow-y: scroll;
  margin-top: 104px;
}
.select-box .options-container.active + .selected::after {
  transform: rotateX(180deg);
  top: -6px;
}
.select-box .options-container::-webkit-scrollbar {
  width: 8px;
  background: #0d141f;
  border-radius: 0 8px 8px 0;
}
.select-box .options-container::-webkit-scrollbar-thumb {
  background: #525861;
  border-radius: 0 8px 8px 0;
}
.select-box .option,
.selected {
  padding: 12px 24px;
  cursor: pointer;
}
.select-box .option:hover {
  background: #414b57;
}
.select-box label {
  cursor: pointer;
}
.select-box .option .radio {
  display: none;
}
/* Searchbox */
form .caja-busca-select{
  display: block;
  left: .03em;
  position: relative;
  width: 100%;
  z-index: 101;
}
.search-box input.busca-select {
  background-color: #fff;
  box-sizing: border-box;
  width: 100%;
  padding: 12px 16px;
  /*font-family: "Roboto", sans-serif;*/
  font-size: .9em;
  position: absolute;
  border-radius: 8px 8px 0 0;
  z-index: 100;
  border: 8px solid #2f3640;
  opacity: 0;
  pointer-events: none;
  top: 2px;
  transition: all 0.4s;
  /*height: auto;*/
}
.search-box input.busca-select::placeholder{
  -webkit-transform-origin: 0% 100%;
          transform-origin: 0% 100%;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.search-box input.busca-select:focus {
  outline: none;
}
.search-box input.busca-select:focus::placeholder{
  -webkit-transform: translateY(0) scale(0.6);
          transform: translateY(0) scale(0.6);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
}
.select-box .options-container.active ~ .search-box input.busca-select {
  opacity: 1;
  pointer-events: auto;
}
/*FIN NUEVOS CAMPOS SELECT*/
/*NUEVOS CAMPOS RADIO.......................................................*/
.has-contratado{
  color: rgba(0, 0, 0, .35);
  font-size: .9em;
  font-weight: normal;
}
.radio-container {
  font-family: "RobotoCondensed";
  font-size: .9em;
  padding: 8px;
}
.radio-container input[type="radio"] {
  display: none;
}
.radio-container label {
  position: relative;
  cursor: pointer;
  font-weight: bold;
  padding-right: 32px;
}
.radio-container label:nth-last-child(1) {
  padding-right: 0;
}
.radio-container label::before {
  content: "";
  border: 2px solid #222;
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: -8px 20px;
  margin-left: 0;
  border-radius: 50%;
}
.radio-container label::after {
  content: "";
  display: inline-block;
  position: absolute;
  width: 20px;
  height: 20px;
  background: rgba(34, 34, 34, 0);
  left: 5px;
  top: 8px;
  margin: -8px 20px;
  margin-left: 0;
  border-radius: 50%;
  transition: all 0.4s;
}
.radio-container input[type="radio"]:checked + label::after {
  /*background: rgba(34, 34, 34, 1);*/
  background-color: #2f3640;
}
/*FIN NUEVOS CAMPOS RADIO*/
/*FIN COTIZADORES*/
/*BLOG.........................................................................*/
#intro-blog{
  background-color: #fff;
  padding: 4em 0;
  width: 100%;
}
#intro-blog h2,#intro-blog p{
  text-align: center;
  width: 100%;
}
.contenedor-blog{
  background-color: #fff;
  padding: 1em 0 4em 0;
  width: 100%;
}
.noticias-list{
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 1em 0;
  width: 75%;
}
.noticias-home{
  width: 100%;
}
.noticias-cat{
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 20%;
}
.noticias-cat h3,.categorias-repeat{
  width: 100%;
}
.container-blog{
  margin-bottom: 3em;
  position: relative;
  width: 47%;
  z-index: 1;
}
.noticias-home .container-blog{
  width: 31%;
}
.date__box {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #ccc;
  border: 4px solid;
  font-weight: bold;
  padding: 5px 10px;
}
.date__box .date__day {
  font-size: 22px;
}
.blog-card {
  border-color: #b5b5b5;
  border-style: solid;
  border-width: 1px;
  border-radius: 0 1em;
  box-shadow: 0 0 8px 8px rgb(0 0 0 / 10%);
  padding: 30px;
  position: relative;
}
.blog-card p {
  position: relative;
  margin: 1rem 0 0;
}
.blog-card p:first-of-type {
  margin-top: 1.25rem;
}
.blog-card p:first-of-type:before {
  content: "";
  position: absolute;
  height: 5px;
  background: #007bff;
  width: 3.5em;
  top: -0.75rem;
  border-radius: 3px;
}
.blog-card .date__box {
  opacity: 0;
  transform: scale(0.5);
  transition: 300ms ease-in-out;
}
.blog-card .blog-card__background,
.blog-card .card__background--layer {
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.blog-card .blog-card__background {
  padding: 15px;
  background: white;
}
.blog-card .card__background--wrapper {
  border-radius: 0 1em;
  height: 100%;
  clip-path: polygon(0 0, 100% 0, 100% 80%, 0 60%);
  position: relative;
  overflow: hidden;
}
.blog-card .card__background--main {
  height: 100%;
  position: relative;
  transition: 300ms ease-in-out;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.blog-card .card__background--layer {
  z-index: 0;
  opacity: 0;
  background: rgba(0, 0, 0, 0.5);
  transition: 300ms ease-in-out;
}
.blog-card .blog-card__head {
  height: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.blog-card .blog-card__info{
  border-radius: 1em;
  z-index: 10;
  background: white;
  background: linear-gradient(to bottom right, #fff, rgba(255, 255, 255, .75));
  padding: 20px 15px;
}
.blog-card .blog-card__info h3,.blog-card .blog-card__info h2{
  margin-top: 0;
}
.blog-card .blog-card__info h2 a,.blog-card .blog-card__info h3 a{
  color: #101820;
  font-size: .6em;
  transition: 300ms ease-in-out;
}
.blog-card .blog-card__info h3 a{
  font-size: 1em;
}
.blog-card:hover .date__box {
  opacity: 1;
  transform: scale(1);
}
.blog-card:hover .card__background--main {
  transform: scale(1.2) rotate(5deg);
}
.blog-card:hover .card__background--layer {
  opacity: 1;
}
.blog-card:hover .blog-card__info h2 a,.blog-card:hover .blog-card__info h3 a{
  color: #007bff;
}

a.icon-link {
  color: #363738;
  transition: 200ms ease-in-out;
}
a.icon-link i {
  color: #007bff;
}
a.icon-link:hover {
  color: #007bff;
  text-decoration: none;
}

.btn {
  background: white;
  color: #101820;
  font-weight: bold;
  outline: none;
  box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.2);
  overflow: hidden;
  border-radius: 1em 1em .5em 2em;
  height: 50px;
  line-height: 50px;
  display: inline-block;
  padding: 0;
  border: none;
}
.btn:focus {
  box-shadow: none;
}
.btn:hover {
  background: #007bff;
  color: #fff;
}
.btn.btn--with-icon {
  padding-right: 20px;
}
.btn.btn--with-icon i {
  padding: 0px 30px 0px 15px;
  margin-right: 10px;
  height: 50px;
  line-height: 50px;
  vertical-align: bottom;
  color: white;
  background: #007bff;
  clip-path: polygon(0 0, 70% 0, 100% 100%, 0% 100%);
}
.btn.btn--only-icon {
  width: 50px;
}
.categoria-title{
  font-size: 3em;
  margin-bottom: .75em;
  margin-top: 0;
  width: 100%;
}
/*FIN BLOG*/
/*DETALLE PRODUCTO--------------------------------------------------------------*/
#contenedor-detalle,#contenedor-carrito-c{
  background-color: #ddd;
  padding: 10em 0 4em 0;
  position: relative;
  width: 100%;
}
#contenedor-detalle{
  background-color: #fff;
}
.blog-container {
  font-family: "adelle-sans", sans-serif;
  font-weight: 100;
  margin-bottom: 1em;
  padding-bottom: 2em;
  width: 75%;
}
.full-noticia{
  background: #fff;
  border-color: #b5b5b5;
  border-style: solid;
  border-width: 1px;
  border-radius: 0 1em;
  box-shadow: 0 0 8px 8px rgb(0 0 0 / 10%);
  padding-bottom: 2em;
}
.blog-header,.blog-header img{
  border-radius: 0 1em 0 0;
}
.blog-container a {
  color: #0086bf;
  text-decoration: none;
  transition: 0.25s ease;
}
.blog-container a:hover {
  border-color: #0086bf;
  color: #0086bf;
}

.blog-cover {
  /*background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/17779/yosemite-3.jpg");
  background-size: cover;
  border-radius: 5px 5px 0 0;
  height: 15rem;
  box-shadow: inset rgba(0, 0, 0, 0.2) 0 64px 64px 16px;*/
  position: relative;
}

.blog-author,
.blog-author--no-cover {
  align-items: center;
  display: flex;
  left: 0;
  margin: 0 auto;
  padding: 1em;
  /*padding-top: 0.125rem;*/
  position: absolute;
  top: 0;
  width: 100%;
}
.blog-author{
  background: linear-gradient(100deg, rgba(255, 255, 255, .65), rgba(255, 255, 255, 0));
  border-radius: 0 1em 0 0;
}
.blog-author img{
  max-width: 40px;
}
.blog-author h3::before,
.blog-author--no-cover h3::before {
  /*background: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/17779/russ.jpeg");*/
  background-size: cover;
  border-radius: 50%;
  content: " ";
  /*display: inline-block;*/
  display: none;
  height: 40px;
  margin-right: 0.5rem;
  position: relative;
  /*top: 8px;*/
  width: 40px;
}
.blog-author h3 {
  align-items: center;
  background-repeat: no-repeat;
  color: #101820;
  display: flex;
  font-size: 1em;
  font-weight: 400;
  margin: 0;
}
.blog-author--no-cover h3 {
  color: #999999;
  font-weight: 100;
}
.blog-body {
  margin: 1em auto 2em auto;
  width: 80%;
}
.datos-extra{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.video-body {
  height: 100%;
  width: 100%;
}
.blog-title{
  margin: 0 auto 2em auto;
  max-width: 80%;
}
.datos-extra small{
  padding: .25em 0;
  text-align: center;
  width: 100%;
}
.datos-extra small:first-child{
  font-size: 1.1em;
}
.blog-title h1 {
  font-size: 2em;
  margin-top: 0;
  text-align: center;
  text-transform: none;
  width: 100%;
}
.blog-summary h2{
  color: #0086BF;
  font-size: 1.5em;
}
.blog-summary p{
  position: relative;
  text-align: justify;
}
.blog-summary p:first-of-type {
    /*margin-top: 1.25rem;*/
}
.blog-summary p:first-of-type:before {
    content: "";
    position: absolute;
    height: 5px;
    background: #0086bf;
    width: 100%;
    top: -0.75rem;
    border-radius: 3px;
}
.blog-summary ul{
  padding: 0 1rem;
  width: 100%;
}
.blog-summary ul li{
  margin-bottom: 1.5em;
  margin-left: 1em;
}
.blog-summary ul li::before{
  color: #0086bf;
  content: "\f00c";
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  margin-left: -1.3em;
  margin-right: .5em;
}
.blog-tags ul {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  list-style: none;
  padding-top: 1em;
}
.blog-tags li + li {
  margin-left: 0.5rem;
}
.blog-tags a {
  border: 1px solid #999999;
  border-radius: 3px;
  color: #999999;
  font-size: 1em;
  height: 1.5rem;
  line-height: 1.5rem;
  letter-spacing: 1px;
  padding: .5em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  width: 5rem;
}

.blog-footer {
  border-top: 1px solid #e6e6e6;
  margin: 0 auto;
  padding-bottom: 0.125rem;
  padding-top: 1em;
  width: 80%;
}

.blog-footer ul {
  list-style: none;
  display: flex;
  flex: row wrap;
  justify-content: flex-end;
  padding-left: 0;
}

.blog-footer li:first-child {
  margin-right: auto;
}

.blog-footer li + li {
  margin-left: 0.5rem;
}

.blog-footer li {
  color: #999999;
  font-size: 0.75rem;
  letter-spacing: 1px;
  text-align: center;
  text-transform: uppercase;
  position: relative;
  white-space: nowrap;
}
.blog-footer li a {
  align-items: center;
  border: 1px solid #999999;
  border-radius: 3px;
  padding: 0 0.5rem;
  color: #999999;
  display: flex;
  justify-content: center;
  padding: 1em;
}

.comments {
  margin-right: 1rem;
}

.published-date {
  
}

.numero {
  position: relative;
  top: -0.5rem;
}

.icon-star,
.icon-bubble {
  fill: #999999;
  height: 24px;
  margin-right: 0.5rem;
  transition: 0.25s ease;
  width: 24px;
}
.icon-star:hover,
.icon-bubble:hover {
  fill: #ff4d4d;
}


/*PRODUCTO ANTERIOR*/
.contiene-detalle{
  margin: auto;
  max-width: 1280px;
  width: 95%;
}
.navegar-tienda{
  margin: auto;
  max-width: 1280px;
  width: 95%;
}
.navegar-tienda a,.navegar-tienda span{
  padding: .15em;
}
.img-display{
    overflow: hidden;
}
.img-showcase{
    display: flex;
    width: 100%;
    transition: all 0.5s ease;
}
.img-showcase img{
    min-width: 100%;
}
.img-select{
    display: flex;
}
.img-item{
    margin: 0.3rem;
}
.img-item:nth-child(1),
.img-item:nth-child(2),
.img-item:nth-child(3){
    margin-right: 0;
}
.img-item:hover{
    opacity: 0.8;
}
.product-content{
    padding: 2rem 1rem;
}
.product-title{
    font-size: 3rem;
    /*text-transform: capitalize;
    font-weight: 700;*/
    position: relative;
    /*color: #12263a;*/
    margin-top: 0;
}
.product-title::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    width: 80px;
    background: rgba(0,134,191,1);
}
.product-link{
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 0.9rem;
    display: inline-block;
    margin-bottom: 0.5rem;
    background: rgba(0,134,191,1);
    color: #fff;
    padding: 0 0.3rem;
    transition: all 0.5s ease;
}
.product-link:hover{
    opacity: 0.9;
}
.product-rating{
    color: #ffc107;
}
.product-rating span{
    font-weight: 600;
    color: #252525;
}
.product-price{
    /*margin: 1rem 0;*/
    font-size: 1rem;
    font-weight: 700;
}
.product-price span{
    font-weight: 400;
}
.last-price span{
    color: #f64749;
    text-decoration: line-through;
}
.new-price span{
    font-size: 2em;
}
.product-detail h2{
    /*text-transform: capitalize;
    color: #12263a;
    padding-bottom: 0.6rem;*/
}
.product-detail p{
    /*font-size: 0.9rem;*/
    padding: 0.3rem;
    /*opacity: 0.8;*/
}
.product-detail h2{
  font-size: 1.2em;
  margin: 2rem 0 .25rem 0;
}
.product-detail ul,.descripcion-completa ul{
    margin: 1rem 0;
    font-size: 0.9rem;
}
.product-detail ul li,.descripcion-completa ul li{
    margin: 0;
    list-style: none;
    /*background: url(shoes_images/checked.png) left center no-repeat;*/
    background-size: 18px;
    padding-left: 1.7rem;
    margin: 0.4rem 0;
    font-weight: 600;
    opacity: 0.9;
}
.product-detail ul li:before,.descripcion-completa ul li:before{
  color: rgba(0,134,191,1);
  content: "\f00c";
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  margin-left: -1.3em;
  margin-right: .65em;
  width: 1.3em;
}
.product-detail ul li span{
    font-weight: 400;
}
.purchase-info{
  align-items: center;
  display: flex;
  justify-content: center;
    margin: 1.5rem 0;
}
.purchase-info input,
.cantidad-precio .agregando{
    border: 1.5px solid #ddd;
    border-radius: 25px;
    text-align: center;
    padding: 0.45rem 0.8rem;
    outline: 0;
    margin-right: 0.2rem;
    margin-bottom: 1rem;
}
.cantidad-precio .agregando{
  margin-bottom: 0;
}
.purchase-info input{
    width: 60px;
}
.cantidad-precio .agregando{
    cursor: pointer;
    color: #fff;
}
.cantidad-precio .agregando:first-of-type{
    background: rgba(0,134,191,1);
    font-family: "RobotoCondensed";
    font-size: 1.1em;
}
.cantidad-precio .agregando:last-of-type{
    /*background: #f64749;*/
}
.cantidad-precio .agregando:hover{
    opacity: 0.9;
}
.social-links{
    display: flex;
    align-items: center;
}
.social-links a{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: #101820;
    border: 1px solid #101820;
    margin: 0 0.2rem;
    border-radius: 50%;
    text-decoration: none;
    font-size: 0.8rem;
    transition: all 0.5s ease;
}
.social-links a:hover{
    background: rgba(0,134,191,1);
    border-color: transparent;
    color: #fff;
}
.social-links p{
  margin-right: .35em;
}
/*NUEVA GALERIA DETALLE----------------------------------------*/
.product-imgs{
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  position: relative;
}
#view{
  width: 100%;
}
@keyframes splide-loading{
  0%{
    transform:rotate(0);
  }
  to{
    transform:rotate(1turn);
  }
}
.splide__container{
  position:relative;
  box-sizing:border-box;
  width: 100%;
}
.splide__list{
  margin:0!important;
  padding:0!important;
  width:-webkit-max-content;
  width:max-content;
  will-change:transform;
}
.splide.is-active .splide__list{
  display:flex;
}
.splide__pagination{
  display:inline-flex;
  align-items:center;
  width:95%;
  flex-wrap:wrap;
  justify-content:center;
  margin:0;
}
.splide__pagination li{
  list-style-type:none;
  display:inline-block;
  line-height:1;
  margin:0;
}
.splide{
  visibility:hidden;
}
.splide,.splide__slide{
  position:relative;
  outline:none;
}
.splide__slide{
  box-sizing:border-box;
  list-style-type:none!important;
  margin:0;
  flex-shrink:0;
}
.splide__slide img{
  vertical-align:bottom;
}
.splide__slider{
  position:relative;
}
.splide__spinner{
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  margin:auto;
  display:inline-block;
  width:20px;
  height:20px;
  border-radius:50%;
  border:2px solid #999;
  border-left-color:transparent;
  animation:splide-loading 1s linear infinite;
}
.splide__track{
  position:relative;
  z-index:0;
  overflow:hidden;
  width: 100%;
}
/*---------*/
.splide__track ul.amplis .splide__slide img{
  width: 100%;
}
.splide__track ul.minis{
  /*height: 120px;*/
}
.splide__track ul.minis .is-visible{
  margin-right: 0;
  max-width: 80px;
  height: 100%;
}
.splide__track ul.minis .splide__slide img{
  width: 100%;
}
.splide__track ul.minis li{
  margin-right: 0;
}
/*-----------*/
.splide--draggable>.splide__track>.splide__list>.splide__slide{
  -webkit-user-select:none;
  user-select:none;
}
.splide--fade>.splide__track>.splide__list{
  display:block;
  width: 100%;
}
.splide--fade>.splide__track>.splide__list>.splide__slide{
  position:absolute;
  top:0;
  left:0;
  z-index:0;
  opacity:0;
}
.splide--fade>.splide__track>.splide__list>.splide__slide.is-active{
  /*height: 100vh;*/
  position:relative;
  z-index:1;
  opacity:1;
}
.splide--rtl{
  direction:rtl;
}
.splide--ttb>.splide__track>.splide__list{
  display:block;
}
.splide--ttb>.splide__pagination{
  width:auto;
}
.splide__arrow{
  font-family: "RobotoCondensed";
  position:absolute;
  z-index:1;
  top:50%;
  transform:translateY(-50%);
  width:2em;
  height:2em;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  padding:0;
  opacity:.7;
  background:rgba(0,134,191,1);
}
.splide__arrow svg{
  width:1.2em;
  height:1.2em
}
.splide__arrow:hover{
  cursor:pointer;
  opacity:.9;
}
.splide__arrow:focus{
  outline:none;
}
.splide__arrow--prev{
  left:1em;
}
.splide__arrow--prev svg{
  transform:scaleX(-1);
}
.splide__arrow--next{
  right:1em;
}
.splide__pagination{
  position:absolute;
  z-index:1;
  bottom:.5em;
  left:50%;
  transform:translateX(-50%);
  padding:0;
}
.splide__pagination__page{
  display:inline-block;
  width:8px;
  height:8px;
  background:#ccc;
  border-radius:50%;
  margin:3px;
  padding:0;
  transition:transform .2s linear;
  border:none;
  opacity:.7;
}
.splide__pagination__page.is-active{
  transform:scale(1.4);
  background:#0086bf;
}
.splide__pagination__page:hover{
  cursor:pointer;
  opacity:.9;
}
.splide__pagination__page:focus{
  outline:none;
}
.splide__progress__bar{
  width:0;
  height:3px;
  background:#ccc;
}
.splide--nav>.splide__track>.splide__list>.splide__slide{
  border:3px solid transparent;
  cursor: pointer;
  max-width: 80px;
}
.splide--nav>.splide__track>.splide__list>.splide__slide.is-active{
  border-color:#101820;
}
.splide--nav>.splide__track>.splide__list>.splide__slide:focus{
  outline:none;
}
.splide--rtl>.splide__arrows .splide__arrow--prev,
.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev{
  right:1em;
  left:auto;
}
.splide--rtl>.splide__arrows .splide__arrow--prev svg,
.splide--rtl>.splide__track>.splide__arrows .splide__arrow--prev svg{
  transform:scaleX(1);
}
.splide--rtl>.splide__arrows .splide__arrow--next,
.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next{
  left:1em;
  right:auto;
}
.splide--rtl>.splide__arrows .splide__arrow--next svg,
.splide--rtl>.splide__track>.splide__arrows .splide__arrow--next svg{
  transform:scaleX(-1);
}
.splide--ttb>.splide__arrows .splide__arrow,
.splide--ttb>.splide__track>.splide__arrows .splide__arrow{
  left:50%;
  transform:translate(-50%);
}
.splide--ttb>.splide__arrows .splide__arrow--prev,
.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev{
  top:1em;
}
.splide--ttb>.splide__arrows .splide__arrow--prev svg,
.splide--ttb>.splide__track>.splide__arrows .splide__arrow--prev svg{
  transform:rotate(-90deg);
}
.splide--ttb>.splide__arrows .splide__arrow--next,
.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next{
  top:auto;
  bottom:1em;
}
.splide--ttb>.splide__arrows .splide__arrow--next svg,
.splide--ttb>.splide__track>.splide__arrows .splide__arrow--next svg{
  transform:rotate(90deg);
}
.splide--ttb>.splide__pagination{
  display:flex;
  flex-direction:column;
  bottom:50%;
  left:auto;
  right:.5em;
  transform:translateY(50%);
}
/*EFECTO ZOOM DETALLE-----------------*/

/*FIN EFECTO ZOOM DETALLE*/
/*FIN DE LA NUEVA GALERIA DETALLE*/
/*CANTIDAD---------------------------------------------*/
.cantidad-precio{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: 1.5em 0;
}
.quantity,.num-product{
  align-items: center;
  border: 2px solid rgba(0, 0, 0, .2);
  border-radius: 40px;
  display: flex;
  height: 40px;
  justify-content: center;
  margin-right: 1em;
  position: relative;
  transition: .5s;
  width: 80px;
}
.quantity:hover{
  border: 2px solid rgba(0, 0, 0, 1);
  width: 120px;
}
.quantity button,.quantity div{
  background-color: transparent;
  color: rgba(0, 0, 0, .2);
  cursor: pointer;
  font-size: 1.5em;
  height: 40px;
  width: 40px;
  z-index: 1;
}
.quantity button:hover, .quantity div:hover{
  color: rgba(0,134,191,1);
}
.quantity button:focus,.quantity div:focus{
  border: transparent;
}
.quantity input[type=text],.quantity input[type=number]{
  border: 0;
  height: auto;
  margin: 0;
  position: absolute;
  text-align: center;
}
.quantity input[type=number]::-webkit-inner-spin-button, 
.quantity input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
.quantity button.plus-btn,.quantity button.minus-btn,
.quantity div.plus-btn,.quantity div.minus-btn{
  opacity: 0;
  position: absolute;
  right: 30px;
  text-align: center;
  transition: .5s;
  top: 0;
}
.quantity button.minus-btn,.quantity div.minus-btn{
  left: 30px;
}
.quantity:hover button.plus-btn,.quantity:hover div.plus-btn{
  opacity: 1;
  right: 0;
}
.quantity:hover button.minus-btn,.quantity:hover div.minus-btn{
  opacity: 1;
  left: 0;
}
#price,.price{
  display: none;
}
.ver-productos-btn{
  background: rgba(0,134,191,1);
  color: #fff;
  font-family: "RobotoCondensed";
  font-size: 1.1em;
  border: 1.5px solid #ddd;
  border-radius: 25px;
  text-align: center;
  padding: 0.45rem 0.8rem;
  outline: 0;
  margin-right: 0.2rem;
}
.table_row .column-4{
  padding: 0;
}
/*FIN DE LA CANTIDAD------------------*/
@media screen and (min-width: 992px){
    .contiene-detalle{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 1.5rem;
    }
    .card-wrapper{
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    /*.product-imgs{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }*/
    .product-content{
        padding-top: 0;
    }
}
/*FIN DETALLE PRODUCTO*/
/*PÁGINA CARRITO DE COMPRÁS-------------------------------------------------------*/
.contiene-mi-carrito{
  background-color: #fff;
  width: 100%;
}
.papa-carrito{
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto 3em auto;
  width: 95%;
}
.carrito-izq{
  width: 67%;
}
.al-cien{
  width: 100%;
}
.contiene-tabla{
  /*max-height: 446px;*/
  overflow-y: auto;
  overflow-x: auto;
}
.contiene-tabla::-webkit-scrollbar{
  -webkit-appearance: none;
  width: 14px;
  height: 14px;
}
.contiene-tabla::-webkit-scrollbar-thumb{
  border-radius: 8px;
  border: 3px solid #fff;
  background-color: rgba(0, 0, 0, .3);
}
#tblCarrito{
  border-collapse: collapse;
  height: 210px;
  table-layout: fixed;
  width: 800px;
}
h1.car-title{
  font-size: 3em;
  margin-top: 0;
}
.table_head{
  border-bottom-color: rgba(0, 0, 0, 1.0);
  border-bottom-style: solid;
  border-bottom-width: 3px;
  /*padding: 1em;*/
  text-align: left;
  width: 100%;
}
#tblCarrito th, td {
  padding: 1em;
}
#tblCarrito td{
  padding: .25em;
}
#tblCarrito th{
  background-color: #fff;
}
#tblCarrito .table_row{
  border-bottom: rgba(0, 0, 0, .5) dashed 1px;
  margin-bottom: .5em;
}
#tblCarrito tr:nth-child(odd) {
  background-color: #f5f5f5;
}

#tblCarrito tr:nth-child(even) {
  background-color: #fff;
}
#tblCarrito th:nth-child(2){
  width: auto;
}
#tblCarrito th:nth-child(2){
  width: auto;
}
#tblCarrito th:nth-child(6){
  width: 20px;
}
#tblCarrito td:nth-child(6){
  padding: 0;
}
#tblCarrito th:nth-child(4){
  width: 150px;
}
#tblCarrito td:nth-child(6) div{
  color: #0086bf;
  text-align: center;
  width: 100%;
}
#tblCarrito td:nth-child(6) div svg{
  cursor: pointer;
}
#tblCarrito td:nth-child(6) div svg:hover{
  color: #101820;
}
#tblCarrito tbody tr.table_row td:first-child img{
  max-width: 100px;
}
.carrito-der{
  width: 25%;
}
.contenedor-totales{
  width: 100%;
}
.contenedor-totales h2,.contenedor-totales h3{
  border-bottom-color: rgba(0, 0, 0, 1.0);
  border-bottom-style: solid;
  border-bottom-width: 3px;
  padding-top: .25em;
  padding-bottom: .4em;
  margin-bottom: .5em;
}
.contenedor-totales h3{
  margin-bottom: .75em; 
}
.subtotal-envio{
  align-items: center;
  border-bottom-color: rgba(0, 0, 0, .5);
  border-bottom-style: dashed;
  border-bottom-width: 1px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-bottom: 1em;
  padding-bottom: 1em;
}
.subtotal,.envio,.todo-totales{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.todo-totales{
  border-bottom-color: rgba(0, 0, 0, .5);
  border-bottom-style: dashed;
  border-bottom-width: 1px;
  margin-bottom: 1em;
  padding-bottom: 1em;
}
#totalCompra{
  font-size: 1.5em;
  font-weight: bold;
}
/*X PARA CERRAR MODAL........................................*/
.notblock{
  display: none;
}
/*FIN DE LA PÁGINA CARRITO DE COMPRAS*/
/*PROCESAR PAGO-------------------------------------------------------------------*/
.contenedor-procesar{
  background-color: #fff;
  width: 100%;
}
/*TAB PROCESAR PAGO----------*/
.tab-pago ::selection{
  background: rgba(0,134,191,.3);
}
.tab-pago{
  /*max-width: 700px;*/
  width: 100%;
  /*margin: 200px auto;*/
  padding: 0 30px 30px 30px;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0px 10px 15px rgba(16,24,32,.1);
}
.tab-pago nav{
  position: relative;
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
  margin-bottom: 1em;
}
.tab-pago nav label{
  display: block;
  height: 100%;
  width: auto;
  text-align: center;
  line-height: 50px;
  cursor: pointer;
  position: relative;
  z-index: 1;
  color: #101820;
  font-size: 17px;
  border-radius: 5px;
  /*margin: 0 10px;*/
  padding: 0 10px;
  transition: all 0.3s ease;
}
.tab-pago nav label:hover{
  background: rgba(0,134,191,.3);

}
#tab-login:checked ~ nav label.tab-login,
#tab-registro:checked ~ nav label.tab-registro{
  color: #fff;
}
.tab-pago nav .slider{
  position: absolute;
  height: 100%;
  width: 110px;
  left: 0;
  bottom: 0;
  z-index: 0;
  border-radius: 5px;
  background: rgba(0,134,191,1);
  transition: all 0.3s ease;
}
.caja-formularios{
  border-top-color: rgba(0, 0, 0, 1.0);
  border-top-style: solid;
  border-top-width: 3px;
}
.tab-pago input[type="radio"]{
  display: none;
}
.tab-pago #tab-registro:checked ~ nav .slider{
  left: 110px;
}
.tab-pago section .content{
  display: none;
  background: #fff;
}
#tab-login:checked ~ section .content-1,
#tab-registro:checked ~ section .content-2{
  display: block;
}
.tab-pago section .content .title{
  font-size: 21px;
  font-weight: 500;
  margin: 30px 0 10px 0;
}
.tab-pago section .content p{
text-align: justify;
}

/*FORMULARIOS LOGIN Y REGISTRO--------------------*/
#formLogin button,
#formLogin input,
#formLogin select,
#divtipopago select,
#formLogin textarea,
#formRegister button,
#formRegister input,
#formRegister select,
#formRegister textarea,
#formEnvio button,
#formEnvio input,
#formEnvio select,
#formEnvio textarea{
  font-size: 100%;
  margin: 0;
  max-width: 100%;
  vertical-align: baseline;
}
#formLogin input,
#formRegister input,
#formEnvio input{
  height: auto;
}
#formLogin textarea,
#formLogin input,
#formRegister textarea,
#formRegister input,
#formEnvio textarea,
#formEnvio input {
  outline: none;
}
#formLogin textarea,
#formRegister textarea,
#formEnvio textarea {
  overflow: auto;
  vertical-align: top;
}

/* Layout Stuff */
.comment-section {
  width: 100%;
  max-width: 760px;
  margin: 30px auto;
}
#formLogin,#formRegister,#formEnvio {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: space-between;
}
#formLogin > [class^="comment-form"],
#formLogin > .form-submit,
#formRegister > [class^="comment-form"],
#formRegister > .form-submit,
#formEnvio > [class^="comment-form"],
#formEnvio > .form-submit {
  position: relative;
  min-height: 1px;
  padding: 15px;
  width: 100%;
  /*-webkit-box-flex: 0;
  -webkit-flex: 0 0 100%;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;*/
  width: 100%;
}
#formLogin > [class^="comment-form"],#formRegister > [class^="comment-form"],
#formEnvio > [class^="comment-form"]{
  display: flex;
}

@media (min-width: 980px) {
  #formLogin > .comment-form-name,
  #formLogin > .comment-form-surname,
  #formLogin > .comment-form-email,
  #formLogin > .comment-form-url,
  #formRegister > .comment-form-name,
  #formRegister > .comment-form-surname,
  #formRegister > .comment-form-phone,
  #formRegister > .comment-form-email,
  #formRegister > .comment-form-url,
  #formEnvio > .comment-form-name,
  #formEnvio > .comment-form-surname,
  #formEnvio > .comment-form-phone,
  #formEnvio > .comment-form-email,
  #formEnvio > .comment-form-url {
    /*-webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;*/
    width: 48%;
  }
  #formEnvio > .campo-fulw{
    width: 100%;
  }
}

/* Form Stuff */
#formLogin input[type="text"],
#formLogin input[type="email"],
#formLogin input[type="url"],
#formLogin input[type="password"],
#formLogin textarea,
#divtipopago select,
#formRegister input[type="text"],
#formRegister input[type="email"],
#formRegister input[type="url"],
#formRegister input[type="password"],
#formRegister textarea,
#formEnvio input[type="text"],
#formEnvio input[type="email"],
#formEnvio input[type="url"],
#formEnvio input[type="password"],
#formEnvio textarea {
  background-color: #fff;
  border: 1px solid #d8d8d8;
  padding: 24px 10px 12px;
  font-size: 16px;
  font-size: 1rem;
}

#formLogin input[type="text"],
#formLogin input[type="email"],
#formLogin input[type="url"],
#formLogin textarea,
#divtipopago select,
#formRegister input[type="text"],
#formRegister input[type="email"],
#formRegister input[type="url"],
#formRegister textarea,
#formEnvio input[type="text"],
#formEnvio input[type="email"],
#formEnvio input[type="url"],
#formEnvio textarea {
  background-color: #fff;
  padding: 24px 10px 12px;
  font-size: 16px;
  font-size: 1rem;
  width: 100%;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
#divtipopago select{
  padding: 0 .5em;
}
:focus {
  outline: 0;
}
#formLogin input[type="text"]:focus,
#formLogin input[type="email"]:focus,
#formLogin input[type="url"]:focus,
#formLogin textarea:focus,
#formRegister input[type="text"]:focus,
#formRegister input[type="email"]:focus,
#formRegister input[type="url"]:focus,
#formRegister textarea:focus,
#formEnvio input[type="text"]:focus,
#formEnvio input[type="email"]:focus,
#formEnvio input[type="url"]:focus,
#formEnvio textarea:focus {
  background-color: #fff;
}

/*Animations*/
@-webkit-keyframes silo-fade {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-1.4em);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes silo-fade {
  0% {
    opacity: 0;
    -moz-transform: translateY(-1.4em);
  }
  100% {
    opacity: 1;
    -moz-transform: translateY(0);
  }
}
@keyframes silo-fade {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-1.4em);
    -moz-transform: translateY(-1.4em);
    -ms-transform: translateY(-1.4em);
    -o-transform: translateY(-1.4em);
    transform: translateY(-1.4em);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}

@-webkit-keyframes silo-help {
  0% {
    opacity: 0;
  }
  4% {
    opacity: 0;
  }
  5% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes silo-help {
  0% {
    opacity: 0;
  }
  4% {
    opacity: 0;
  }
  5% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes silo-help {
  0% {
    opacity: 0;
  }
  4% {
    opacity: 0;
  }
  5% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

/* Label styles */
#formLogin label,#formRegister label,#formEnvio label {
  padding: 5px 0;
  font-size: 14px;
  font-size: 0.75rem;
  display: none;
  position: absolute;
  top: 15px;
  left: 26px;
  color: #8bc34a;
  -webkit-animation: silo-fade 0.2s;
  -moz-animation: silo-fade 0.2s;
  animation: silo-fade 0.2s;
  max-width: 80%;
}
#formLogin input:focus + label,
#formLogin input[required]:valid + label,
#formLogin input:not(:placeholder-shown) + label,
#formLogin textarea:focus + label,
#formLogin textarea:valid + label,
#formLogin textarea:not(:placeholder-shown) + label,
#formRegister input:focus + label,
#formRegister input[required]:valid + label,
#formRegister input:not(:placeholder-shown) + label,
#formRegister textarea:focus + label,
#formRegister textarea:valid + label,
#formRegister textarea:not(:placeholder-shown) + label,
#formEnvio input:focus + label,
#formEnvio input[required]:valid + label,
#formEnvio input:not(:placeholder-shown) + label,
#formEnvio textarea:focus + label,
#formEnvio textarea:valid + label,
#formEnvio textarea:not(:placeholder-shown) + label {
  display: block;
}
#formLogin input:valid,
#formLogin textarea:valid,
#formRegister input:valid,
#formRegister textarea:valid,
#formEnvio input:valid,
#formEnvio textarea:valid {
  border: 1px solid #8bc34a;
  background-color: rgba(139, 195, 74, 0.25);
}
#formLogin input:focus:valid,
#formLogin textarea:focus:valid,
#formRegister input:focus:valid,
#formRegister textarea:focus:valid,
#formEnvio input:focus:valid,
#formEnvio textarea:focus:valid {
  border: 1px solid #8bc34a;
  background-color: transparent;
}
#formLogin input:valid + label,
#formLogin textarea:valid + label,
#formRegister input:valid + label,
#formRegister textarea:valid + label,
#formEnvio input:valid + label,
#formEnvio textarea:valid + label {
  color: #8bc34a;
}
#formLogin input:invalid,
#formLogin textarea:invalid,
#formLogin input.is-invalid,
#formLogin textarea.is-invalid,
#formRegister input:invalid,
#formRegister textarea:invalid,
#formRegister input.is-invalid,
#formRegister textarea.is-invalid,
#formEnvio input:invalid,
#formEnvio textarea:invalid,
#formEnvio input.is-invalid,
#formEnvio textarea.is-invalid {
  border: 1px solid #b92326;
  background-color: rgba(185, 35, 38, 0.25);
}
#formLogin input:focus:invalid,
#formLogin textarea:focus:invalid,
#formLogin input:focus.is-invalid,
#formLogin textarea:focus.is-invalid,
#formRegister input:focus:invalid,
#formRegister textarea:focus:invalid,
#formRegister input:focus.is-invalid,
#formRegister textarea:focus.is-invalid,
#formEnvio input:focus:invalid,
#formEnvio textarea:focus:invalid,
#formEnvio input:focus.is-invalid,
#formEnvio textarea:focus.is-invalid {
  background-color: transparent;
  border: 1px solid #b92326;
  box-shadow: 0 0 0 0.2rem rgba(220,53,69,.25);
}
#formLogin input:invalid + label,
#formLogin textarea:invalid + label,
#formLogin input.is-invalid + label,
#formLogin textarea.is-invalid + label,
#formRegister input:invalid + label,
#formRegister textarea:invalid + label,
#formRegister input.is-invalid + label,
#formRegister textarea.is-invalid + label,
#formEnvio input:invalid + label,
#formEnvio textarea:invalid + label,
#formEnvio input.is-invalid + label,
#formEnvio textarea.is-invalid + label {
  color: #b92326;
}
/*#formLogin input:invalid + label,
#formLogin textarea:invalid + label,
#formRegister input:invalid + label,
#formRegister textarea:invalid + label,
#formEnvio input:invalid + label,
#formEnvio textarea:invalid + label {
  color: #b92326;
}*/
#formLogin input:focus:invalid + label:after,
#formLogin textarea:focus:invalid + label:after,
#formLogin input:focus.is-invalid + label:after,
#formLogin textarea:focus.is-invalid + label:after,
#formRegister input:focus:invalid + label:after,
#formRegister textarea:focus:invalid + label:after,
#formRegister input:focus.is-invalid + label:after,
#formRegister textarea:focus.is-invalid + label:after,
#formEnvio input:focus:invalid + label:after,
#formEnvio textarea:focus:invalid + label:after,
#formEnvio input:focus.is-invalid + label:after,
#formEnvio textarea:focus.is-invalid + label:after {
  content: " (" attr(data-help) ")";
  animation: silo-help 100s;
}
#formLogin input:invalid + label:after,
#formLogin textarea:invalid + label:after,
#formLogin input.is-invalid + label:after,
#formLogin textarea.is-invalid + label:after,
#formRegister input:invalid + label:after,
#formRegister textarea:invalid + label:after,
#formRegister input.is-invalid + label:after,
#formRegister textarea.is-invalid + label:after,
#formEnvio input:invalid + label:after,
#formEnvio textarea:invalid + label:after,
#formEnvio input.is-invalid + label:after,
#formEnvio textarea.is-invalid + label:after {
  content: " (" attr(data-help) ")";
}

#formLogin input:placeholder-shown,
#formLogin textarea:placeholder-shown,
#formRegister input:placeholder-shown,
#formRegister textarea:placeholder-shown,
#formEnvio input:placeholder-shown,
#formEnvio textarea:placeholder-shown {
  background-color: transparent;
  border: 1px solid #d8d8d8;
  width: 100%;
}
#formLogin input::placeholder,
#formLogin textarea::placeholder,
#formRegister input::placeholder,
#formRegister textarea::placeholder,
#formEnvio input::placeholder,
#formEnvio textarea::placeholder {
  /*color: #d8d8d8;*/
}
#formLogin input::-webkit-input-placeholder,
#formLogin textarea::-webkit-input-placeholder,
#formRegister input::-webkit-input-placeholder,
#formRegister textarea::-webkit-input-placeholder,
#formEnvio input::-webkit-input-placeholder,
#formEnvio textarea::-webkit-input-placeholder {
  /*color: #d8d8d8;*/
}
#formLogin input:-ms-input-placeholder,
#formLogin textarea:-ms-input-placeholder,
#formRegister input:-ms-input-placeholder,
#formRegister textarea:-ms-input-placeholder,
#formEnvio input:-ms-input-placeholder,
#formEnvio textarea:-ms-input-placeholder {
  /*color: #d8d8d8;*/
}
#formLogin input::-moz-placeholder,
#formLogin textarea::-moz-placeholder,
#formRegister input::-moz-placeholder,
#formRegister textarea::-moz-placeholder,
#formEnvio input::-moz-placeholder,
#formEnvio textarea::-moz-placeholder {
  /*color: #d8d8d8;*/
}
#formLogin input:focus::placeholder,
#formLogin textarea:focus::placeholder,
#formRegister input:focus::placeholder,
#formRegister textarea:focus::placeholder,
#formEnvio input:focus::placeholder,
#formEnvio textarea:focus::placeholder {
  color: transparent;
}
#formLogin input:focus::-webkit-input-placeholder,
#formLogin textarea:focus::-webkit-input-placeholder,
#formRegister input:focus::-webkit-input-placeholder,
#formRegister textarea:focus::-webkit-input-placeholder,
#formEnvio input:focus::-webkit-input-placeholder,
#formEnvio textarea:focus::-webkit-input-placeholder {
  color: transparent;
}
#formLogin input:focus:-ms-input-placeholder,
#formLogin textarea:focus:-ms-input-placeholder,
#formRegister input:focus:-ms-input-placeholder,
#formRegister textarea:focus:-ms-input-placeholder,
#formEnvio input:focus:-ms-input-placeholder,
#formEnvio textarea:focus:-ms-input-placeholder {
  color: transparent;
}
#formLogin input:focus::-moz-placeholder,
#formLogin textarea:focus::-moz-placeholder,
#formRegister input:focus::-moz-placeholder,
#formRegister textarea:focus::-moz-placeholder,
#formEnvio input:focus::-moz-placeholder,
#formEnvio textarea:focus::-moz-placeholder {
  color: transparent;
}
#formLogin input[type="submit"],#formRegister input[type="submit"],
#formEnvio input[type="submit"] {
  background-color: transparent;
  border: 1px solid #8bc34a;
  color: #8bc34a;
  padding: 5px 15px;
  font-size: 16px;
  font-size: 1rem;
  margin: 15px auto;
  vertical-align: middle;
  display: block;
  cursor: pointer;
}
#formLogin input[type="submit"]:hover,#formRegister input[type="submit"]:hover,
#formEnvio input[type="submit"]:hover {
  background-color: rgba(139, 195, 74, 0.25);
  border: 1px solid #8bc34a;
}
#formEnvio h1{
  width: 100%;
}
.divmetodpago{
  /*border-bottom-color: rgba(0, 0, 0, .5);
  border-bottom-style: dashed;
  border-bottom-width: 1px;*/
  margin-bottom: 0;
  padding-bottom: .5em;
}
.divmetodpago label {
  align-items: center;
  display: flex;
  margin-bottom: .5rem;
  width: 100%;
}
.divmetodpago label input {
    margin-right: 15px;
}
.dolar-colombia-widget strong{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  padding: 0 0 .5em 0;
}
.dolar-colombia-widget strong img{
  margin-right: .25em;
}
.dolar-colombia-widget strong img:last-child{
  margin-left: .25em;
}
#msgwompi,#msgpaypal{
  background-color: #02458d;
  border-radius: .5em;
  color: rgba(255, 255, 255, .65);
  margin-top: 1em;
  padding: .5em;
}
#msgpaypal{
  background-color: #009cde;
  color: rgba(255, 255, 255, .75);
}
#divtipopago{
  margin-top: 1em;
}
/*FIN DE LOS FORMULARIOS LOGIN Y REGISTRO*/
/*FIN TAB PROCESAR PAGO*/
/*FIN DE PROCESAR PAGO*/
/*PAGOS---------------------------------------------------------------------------*/
#result{
  padding-bottom: 3em;
  padding-top: 3em;
}
.lista-pagos{

}
.lista-pagos h1{
  color: #101820;
  font-size: 3em;
}
.graficop{
  margin: .5em;
}
.codigop{
  border-bottom-color: #777;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  margin-bottom: 1em;
}
.nombrep h3{
  margin: .25em; 
}
.codigo-presupuesto{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.graficop-codigop-nombrep{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}
.cuota{
  align-items: center;
  border-color: #ddd;
  border-radius: .35em;
  border-style: solid;
  border-width: 1px;
  box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .2);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: .5em 0;
  padding: .5em;
  width: 100%;
}
.nombre-cuota{
  text-align: left;
  width: 100%;
}
.nombre-cuota h3{
  border-bottom-color: #ccc;
  border-bottom-style: dashed;
  border-bottom-width: 1px;
  margin: 0 0 .5em 0;
  padding-bottom: .5em;
}
.pago-info{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.alinear-izq{
  text-align: left;
}
.pago-precio{
  font-size: 2em;
  font-weight: bold;
}
.precio-chico{
  font-size: 1.5em;
}
.volver-pagar-btn{
  margin-bottom: 2em;
  margin-top: 1em;
  max-width: 250px;
}
.seguro-consulta{
  border-color: #666;
  border-style: dashed;
  border-width: 1px;
  padding: .5em;
  text-align: left;
  width: 100%;
}
.pago-referencia{
  text-align: left;
}
.paga-btn{
  background-color: rgba(0,134,191,1);
  border-color: rgba(0,134,191,1);
  border-style: solid;
  border-radius: .25em .5em .25em 1.5em;
  border-width: 1px;
  color: rgba(255,255,255,1);
  cursor: pointer;
  font-size: 1.5em;
  font-weight: bold;
  max-width: 150px;
  padding: .5em;
  text-align: center;
  transition: all .7s;
}
.paga-btn:hover{
  background-color: transparent;
  border-color: rgba(0,134,191,1);
  border-style: double;
  border-radius: .25em .5em .25em .5em;
  color: rgba(0,134,191,1);
}
.confirmar-btn{
  background-color: rgba(0,134,191,1);
  border-color: rgba(0,134,191,1);
  border-radius: 0 0 .5em 0;
  border-style: solid;
  border-width: 1px;
  color: #fff;
  margin: 1em auto;
  padding: .8em 2em;
}
/*FIN PAGOS*/
/*CONTACTO FORMULARIO-------------------------------------------------------------*/
.contact-form,.presupuesto-form,.busca-pago-form,.trabaja-form{
  --form-ok-color: rgba(0,134,191,1);
  --form-error-color: #F44336;
}
.contact-form [required]:valid,.presupuesto-form [required]:valid,.busca-pago-form [required]:valid,
.trabaja-form [required]:valid{
  border-bottom: 2px solid var(--form-ok-color);
  color: rgba(0,134,191,1);
  font-weight: bold;
}
.contact-form [required]:invalid,.presupuesto-form [required]:invalid,.busca-pago-form [required]:invalid,
.trabaja-form [required]:invalid{
  border-bottom: 2px solid var(--form-error-color);
  color: #F44336;
  font-weight: bold;
}
.contact-form-error,.presupuesto-form-error,.busca-pago-form-error,.trabaja-form-error{
  background-color: var(--form-error-color);
  border-radius: 0 0 .5em 0;
  box-shadow: 1px 1px 4px 1px rgba(0, 0, 0, .3);
  color: #fff;
  font-size: 80%;
  margin-top: -10px;
  padding: .25em .5em;
  transition: all 800ms ease;
  width: 100%;
}
.contact-form-error.is-active,.presupuesto-form-error.is-active,.busca-pago-form-error.is-active,
.trabaja-form-error.is-active{
  display: block;
  animation: show-message 1s 1 normal 0s ease-out both;
}
.none{
  display: none;
}
@keyframes show-message {
  0%{
    visibility: hidden;
    opacity: 0;
  }
  100%{
    visibility: visible;
    opacity: 1;
  }
}
.helper-text{
    color: #F44336;
    font-size: 80%;
    padding: .25em .5em;
    width: 100%;
}
.mensaje-contact::-webkit-scrollbar {
    width: .5em;
}
.mensaje-contact::-webkit-scrollbar-track {
  cursor: pointer;
    -webkit-box-shadow: inset 0 0 6px rgba(16,24,32,.5);
}
.mensaje-contact::-webkit-scrollbar-thumb {
  background-color: rgba(0,134,191,1);
  outline: 1px solid slategrey;
}
.cotizar-checkbox-item input.acepto{
  /*opacity: 0;
  width: 100%;
  z-index: 3;*/
}
/*FIN CONTACTO FORMULARIO*/
/*CURSOS-----------------------------------------------------------------------------------*/
.contiene-cotizar {
  display: grid;
  grid-gap: 4em;
  grid-template-areas:
      "cotizar-txt cotizar-txt cotizar-txt cotizar-txt"
      "cotizar-form-a cotizar-form-b cotizar-form-c cotizar-form-d";
  grid-template-columns: repeat(4, 1fr);
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.cotizar-txt{
  grid-area: cotizar-txt;
  margin-bottom: 3em;
}
.cotizar-txt p{
  text-align: justify;
}
.cotizar-form-a{
  grid-area: cotizar-form-a;
  position: relative;
}
.cotizar-form-b{
  grid-area: cotizar-form-b;
  position: relative;
}
.cotizar-form-c{
  grid-area: cotizar-form-c;
  position: relative;
}
.cotizar-form-d{
  grid-area: cotizar-form-d;
  position: relative;
}
/*----------------------*/
.photo{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  /*position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;*/
}
.photo img{
  /*width: 200px;
  height: 280px;*/
  object-fit: cover;
  filter: grayscale(100%) contrast(120%);
  box-shadow: 10px 15px 25px 0 rgba(16,24,32,.2);
  display: block;
  transition: all .5s cubic-bezier(0.645, 0.045, 0.355, 1);
  margin-top: -10px;
}
.photo:hover img{
  box-shadow: 1px 1px 10px 0 rgba(16,24,32,.1);
  filter: grayscale(0%) contrast(100%);
}
.photo .glow-wrap{
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  margin-top: -10px;
}
.photo .glow{
  display: block;
  position:absolute;
  width: 40%;
  height: 200%;
  background: rgba(255,255,255,.2);
  top: 0;
  filter: blur(5px);
  transform: rotate(45deg) translate(-450%, 0);
  transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.photo:hover .glow{
  transform: rotate(45deg) translate(450%, 0);
  transition: all 1.5s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.photo:hover img,
.photo:hover .glow-wrap{
  margin-top: 0;
}
.cotizar-form-a h3,.cotizar-form-b h3,.cotizar-form-c h3,.cotizar-form-d h3{
  background-color: rgba(252,141,0,.7);
  color: #101820;
  padding: .25em .5em;
  position: absolute;
  z-index: 1;
  /*transform: translate(-25%, -65%);
  font-family: 'Montserrat', sans-serif;
  margin: 0;
  line-height: 1.2;*/
}
.cotizar-form-b h3{
  background-color: rgba(0,134,191,.7);
}
.cotizar-form-c h3{
  background-color: rgba(144,1,148,.7);
  color: #fff;
}
.cotizar-form-d h3{
  background-color: rgba(148,1,1,.7);
  color: #fff;
}
.author{
  background-color: rgba(16,24,32,1);
  border-radius: 0 0 .5em .5em;
  cursor: pointer;
  font-family: "RobotoCondensed";
  font-size: 1em;
  margin: auto;
  padding: .5em 1em;
  position: relative;
  text-transform: uppercase;
  bottom: 1em;
  /*left: 50%;
  transform: translateX(-50%);*/
  color: #888;
  transition: all .7s;
  z-index: 1;
}
.author:hover{
  background-color: rgba(17,148,1,1);
  color: #fff;
}
/*FIN DE CURSOS*/
/*OTROS SERVICIOS--------------------------------------------------------------------------*/
#otros-servicios{
  background-color: #e5e5e5;
  padding: 3em 0;
  width: 100%;
}
.contiene-otros-servicios h2{
  margin: 0 0 2rem 0;
  text-align: center;
}
.contenedor-otros-servicios{
  display: grid;
  grid-gap: 1em;
  grid-template-areas: 
    "cursos-otros diseno-otros web-otros mobile-otros"
    "hosting-otros psd-otros marketing-otros multimedia-otros";
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, 1fr);
  margin: auto;
  max-width: 1280px;
  width: 95%;
}
.contenedor-otros-servicios section{
  background-color: rgba(255,255,255,1);
  border-bottom-color: rgba(0,134,191,1);
  border-bottom-style: solid;
  border-bottom-width: 2px;
  border-radius: 0 0 .5em 0;
  box-shadow: 2px 3px 8px 2px #c5c5c5;
  padding: 3px 3px 1em 3px;
  text-align: center;
}
.contenedor-otros-servicios:nth-child(1){
  grid-area: cursos-otros;
}
.contenedor-otros-servicios:nth-child(2){
  grid-area: diseno-otros;
}
.contenedor-otros-servicios:nth-child(3){
  grid-area: web-otros;
}
.contenedor-otros-servicios:nth-child(4){
  grid-area: mobile-otros;
}
.contenedor-otros-servicios:nth-child(5){
  grid-area: hosting-otros;
}
.contenedor-otros-servicios:nth-child(6){
  grid-area: psd-otros;
}
.contenedor-otros-servicios:nth-child(7){
  grid-area: marketing-otros;
}
.contenedor-otros-servicios:nth-child(8){
  grid-area: multimedia-otros;
}
.servicios-otros img{
  border-top-color: rgba(0,134,191,1);
  border-top-style: solid;
  border-top-width: 2px;
}
.conoce-ser{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}
.servicios-otros h3{
  color: rgba(16,24,32,1);
  margin: .5em auto;
  width: 90%;
}
.servicios-otros a{
  border-color: rgba(0,134,191,1);
  border-style: solid;
  border-width: 1px;
  padding: .5em 1em;
}
.servicios-otros a:hover{
  background-color: rgba(0,134,191,1);
  border-radius: 0 0 .5em 0;
}
/*FIN OTROS SERVICIOS*/
/*SOLICITAR SOPORTE*/
.usuario-cliente,.soporteform-soporteimg{
  display: grid;
  grid-gap: 4em;
  grid-template-areas: 
    "usuario cliente";
  grid-template-columns: repeat(2, 1fr);
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.soporte-usuario{
  grid-area: usuario;
  position: relative;
}
.soporte-usuario h3{
}
.soporte-cliente,.soporteimg,.cursos-pw{
  background-image: url(../images/soporte-clientes.jpg);
  background-position: center center;
  background-size: cover;
  grid-area: cliente;
  position: relative;
}
.cursos-pw{
  background-image: url(../images/cursos.jpg);
}
.superponer-cliente{
  align-items: center;
  display: flex;
  justify-content: center;
  height: 100%;
  position: absolute;
  width: 100%;
}
.soporte-btn{
  background-color: rgba(16,24,32,.8);
  border-color: transparent;
  border-radius: 0 0 .5em 0;
  border-style: solid;
  border-width: 1px;
  border-color: rgba(255,255,255,.5);
  color: #fff;
  margin-bottom: -8em;
  padding: .8em 2em;
  text-shadow: 1px 2px 3px #333;
  text-transform: uppercase;
}
.soporte-btn:hover{
  background-color: rgba(0,134,191,1);
  color: rgba(16,24,32,1);
}
.contiene-list-soporte{
  width: 100%;
}
.soporte-list{
  font-size: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
  border: 0;
}
.trabajamos-list{
  width: 100%;
}
.soporte-list li,.trabajamos-list li{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  padding: .4em .4em .4em 2em;
  margin: .5em 0;
  background: #ECECEC;
  color: #444;
  text-decoration: none;
  border-radius: .3em;
  transition: all .3s ease-out;
}
.icono-dato-list{
  width: 100%;
}
.soporte-list li span{
  margin-right: .5em;
}
.trabajamos-list li{
  padding-left: .5em;
}
.trabajamos-list li span{
  margin-right: 0;
}
.soporte-list li:before{
  align-items: center;
  background: #fff;
  border: .3em solid #fff;
  border-radius: 50%;
  color: #dd7117;
  content: "\f00c";
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-size: 1em;
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  line-height: .4em;
  margin:0;
  /*margin-top: -1em;*/
  position: absolute;
  vertical-align: top;
  left: -.6em;
  /*top: 50%;*/
  height: 1.25em;
  width: 1.25em;
  text-align: center;
  transition: all .3s ease-out;
}
/*FIN SOLICITAR SOPORTE*/
/*TRABAJA EN PÚBLICO WEB------------------------------------------------------------------------------------------------*/
.empleoredes-empleoform{
  align-items: start;
  display: grid;
  grid-gap: 4em;
  grid-template-areas: 
    "empleo-izq empleo-der"
    "empleo-repolitica empleo-repolitica";
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: 1fr max-content;
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.empleo-izq{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  grid-area: empleo-izq;
}
.empleo-txt{
  margin-bottom: 3em;
}
.empleo-icono,.empleo-izq h2,.empleo-izq h3,.empleo-izq h4{
  text-align: center;
  width: 100%;
}
.empleo-icono{
  margin-bottom: 1em;
}
.empleo-izq h2{
  margin-bottom: .5em;
}
.empleo-izq h3,.empleo-izq h4{
  margin-top: 0;
}
.empleo-btns{
  display: grid;
  grid-gap: 1em;
  grid-template-areas: 
    "lk-btn fb-btn";
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: 1fr;
  width: 100%;
}
.lk-btn,.fb-btn{
  background-color: #0077b5;
  border-bottom-color: rgba(16,24,32,.3);
  border-bottom-style: solid;
  border-bottom-width: 3px;
  border-radius: .25em;
  color: rgba(255,255,255,1);
  cursor: pointer;
  font-family: "RobotoCondensed";
  font-size: 1em;
  grid-area: lk-btn;
  padding: 1em 1em;
  text-shadow: 1px 1px 3px rgba(16,24,32,.5);
  transition: all .7s;
}
.fb-btn{
  background-color: #3b5998;
  grid-area: fb-btn;
}
.lk-btn:hover,.fb-btn:hover{
  box-shadow: 1px 3px 5px 1px #999;
  opacity: .8;
}
/*-------------------------------------*/
.empleo-der{
  grid-area: empleo-der;
}
.empleo-der h4{
  margin-top: 0;
}
.empleo-campos{
  align-items: center;
  display: grid;
  grid-gap: 1em;
  grid-template-areas: 
    "empleo-ca empleo-cb"
    "empleo-cc empleo-cd"
    "empleo-ce empleo-cf"
    "empleo-politica empleo-politica"
    "adjunta-cv curriculum-btn";
  grid-template-columns: repeat(2, 1fr);
}
div.wrap-input2:nth-child(1){
  grid-area: empleo-ca;
}
div.wrap-input2:nth-child(2){
  grid-area: empleo-cb;
}
div.wrap-input2:nth-child(3){
  grid-area: empleo-cc;
}
div.wrap-input2:nth-child(4){
  grid-area: empleo-cd;
}
div.wrap-input2:nth-child(5){
  grid-area: empleo-ce;
}
div.wrap-input2:nth-child(6){
  grid-area: empleo-cf;
}
div.wrap-input2:nth-child(7){
  grid-area: empleo-politica;
}
div.wrap-input2:nth-child(8){
  grid-area: adjunta-cv;
  position: relative;
}
div.wrap-input2:nth-child(9){
  grid-area: curriculum-btn;
  position: relative;
}
input[type="file"]#adjunta-file{
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}
label[for="adjunta-file"] {
  /*font-weight: 600;*/
  color: #777;
  background-color: #fff;
  border-color: #999;
  border-style: solid;
  border-width: 1px;
  display: inline-block;
  transition: all .5s;
  cursor: pointer;
  padding: .5em 1em !important;
  /*position: absolute;
  text-transform: uppercase;
  width: fit-content;*/
  width: 100%;
  text-align: center;
 }
 label[for="adjunta-file"] span{
  font-family: "RobotoCondensed";
 }
.wrap-input2 {
  width: 100%;
  position: relative;
  border-bottom: 1px solid #adadad;
  margin-bottom: 1em;
}
div.wrap-input2:nth-child(7),div.wrap-input2:nth-child(8),div.wrap-input2:nth-child(9){
  border-bottom: none;
}
.politica-empleo{
  color: rgba(0,134,191,1);
}
.input2 {
  display: block;
  width: 100%;
  color: #555555;
  line-height: 1.2;
}
.focus-input2 {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
}
.focus-input2::before {
  content: "";
  display: block;
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
  background: rgba(0,134,191,1);
}
.focus-input2::after {
  content: attr(data-placeholder);
  display: block;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0;
  /*font-size: 13px;*/
  color: #999999;
  line-height: 1.2;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}
/*---------------------------------------------*/
input.input2 {
  height: 45px;
  transition: background-color 0.5s ease-in-out;
}
/*Eliminar borde azul por defecto del focus*/
input.input2:focus,textarea.input2:focus{
  outline: none;
}
input.input2 + .focus-input2::after {
  top: 16px;
  left: 0;
}
textarea.input2 {
  min-height: 115px;
  padding-top: 13px;
  padding-bottom: 13px;
}
textarea.input2 + .focus-input2::after {
  top: 16px;
  left: 0;
}
.input2:focus + .focus-input2::after {
  top: -13px;
}
.input2:focus + .focus-input2::before {
  width: 100%;
}
.has-val.input2 + .focus-input2::after {
  top: -13px;
}
.has-val.input2 + .focus-input2::before {
  width: 100%;
}
/*------------------------------------------------------------------
[ Button ]*/
.container-contact2-form-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  /*padding-top: 13px;*/
}
.wrap-contact2-form-btn {
  display: block;
  position: relative;
  z-index: 1;
  border-radius: 2px;
  width: 100%;
  overflow: hidden;
  /*margin: 0 auto;*/
}
.contact2-form-bgbtn {
  position: absolute;
  z-index: -1;
  width: 300%;
  height: 100%;
  background: rgba(219,21,99,1);
  top: 0;
  left: -100%;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}
.contact2-form-btn {
  background-color: rgba(0,134,191,1);
  border-bottom-color: rgba(16,24,32,.3);
  border-bottom-style: solid;
  border-bottom-width: 3px;
  border-radius: .25em;
  color: rgba(255,255,255,1);
  cursor: pointer;
  font-family: "RobotoCondensed";
  font-size: 1em;
  padding: 1em 1em;
  text-shadow: 1px 1px 3px rgba(16,24,32,.5);
  transition: all .7s;
  color: #fff;
  line-height: 1.2;
  width: 100%;
}
.contact2-form-btn:hover{
  box-shadow: 1px 3px 5px 1px #999;
  opacity: .8;
}
.wrap-contact2-form-btn:hover .contact2-form-bgbtn {
  left: 0;
}
/*------------------------------------------------------------------
[ Responsive ]*/
@media (max-width: 576px) {
  .wrap-contact2 {
    padding: 72px 15px 90px 15px;
  }
}
/*------------------------------------------------------------------
[ Alert validate ]*/
.validate-input {
  position: relative;
}
.alert-validate::before {
  content: attr(data-validate);
  position: absolute;
  max-width: 70%;
  background-color: white;
  border: 1px solid #c80000;
  border-radius: 2px;
  padding: 4px 25px 4px 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0px;
  pointer-events: none;
  color: #c80000;
  font-size: 1em;
  line-height: 1.4;
  text-align: left;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  transition: opacity 0.4s;
}
.alert-validate::after {
  content: "\f12a";
  font-family: FontAwesome;
  display: block;
  position: absolute;
  color: #c80000;
  font-size: 16px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 8px;
}
.alert-validate:hover:before {
  visibility: visible;
  opacity: 1;
}
@media (max-width: 992px) {
  .alert-validate::before {
    visibility: visible;
    opacity: 1;
  }
}
.empleo-repolitica{
  grid-area: empleo-repolitica;
  margin-top: -3em;
  text-align: justify;
}
/*FIN TRABAJA EN PÚBLICO WEB*/
/* BLOG---------------------------------------------------------------------------------------------- */
#contiene-blog{
  background-color: rgb(229, 229, 229);
  width: 100%;
}
.contiene-publicacion{
  padding-top: 6em;
}
#cuerpo-blog{
  align-items: flex-start;
  background-color: #e5e5e5;
  display: flex;
  /*display: -webkit-flex;*/
  flex-wrap: wrap;
  justify-content: space-between;
  margin: auto;
  max-width: 1280px;
  padding: 1.2em;
  width: 95%;
}
main#blog, aside#blog-der{
  display: flex;
  /*display: -webkit-flex;*/
  flex-wrap: wrap;
  margin-right: 1em;
  max-width: 100%;
  flex-grow: 1;
  justify-content: space-between;
  text-align: left;
  width: 60%;
}
aside#blog-der{
  margin-left: 1em;
  margin-right: 0;
  width: 25%;
}
main#blog article,main#resultados article{
  background: #fff;
  border-bottom-color: rgba(0,134,191,1);
  border-bottom-style: solid;
  border-bottom-width: 3px;
  box-shadow: 2px 4px 8px rgba(0, 0, 0, .2);
  align-items: flex-start;
  display: flex;
  /*flex-grow: 1;*/
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 1em 0;
  /*padding: 1em;*/
  width: 47.5%;
  height: 100%;
}
main#blog article.articulo-completo{
  width: 100%;
}
.buscaste,.resultados-contador{
  width: 100%;
}
main#resultados{
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
main#resultados article{
  width: 31%;
}
.comentarios{
  background: #fff;
  box-shadow: 2px 4px 8px rgba(0, 0, 0, .2);
  margin: 1em 0;
  padding: 1em;
  width: 100%;
}
.header-nota{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0 1em 1em 1em;
  width: 100%;
}
.header-nota-azul h1,.header-nota h3{
  margin-top: 0;
  margin-bottom: 0;
  width: 100%;
}
.header-nota-azul h1{
  font-size: 2em;
  margin-top: .5em;
  margin-bottom: .5em;
}
.header-nota h4{
  margin: 0;
  width: 100%;
}
.header-nota-azul{
  background-color: rgba(0,134,191,1);
  color: #fff;
}
.publicacion-icon{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: .25em;
  width: 100%;
}
.publicacion-icon small:first-child{
  margin-right: .5em;
}
.categoria-blog{
  background-color: rgba(0, 84, 105, .2);
  border-radius: .5em;
  color: #005469;
  padding: .35em;
}
.categoria-blog-completa{
  background-color: rgba(255, 255, 255, .75);
}
.publicacion-icon small i{
  margin-right: .25em;
}
.img-nota, .info-nota{
  /*margin: .5em;*/
  width: 100%;
  flex-grow: 1;
}
.img-nota{
  overflow:hidden;
  margin-bottom: 1em;
}
.img-nota img{
  transition: all .7s;
}
.img-nota:hover img{
  transform:scale(1.3);
  -webkit-transform:scale(1.3);
}
/*.info-nota{
  flex-grow: 1;
  width: 55%;
}*/
.info-nota{
  text-align: justify;
  padding: 1em;
}
.img-nota-completa{
  margin-bottom: 0;
}
.img-post, .info-post{
  width: 100%;
}
.btn-nota{
  display: flex;
  margin-top: 1em;
  width: 100%;
}
.info-nota a, .info-post a{
  background-color: rgba(0,134,191,1);
  color: rgba(255, 255, 255, .9);
  font-weight: bold;
  padding: .5em;
}
.info-nota a:hover, .info-post a:hover{
  background-color: #d9d9d9;
  color: #101820;
}
.header-nota .btn-nota a{
  background-color: rgba(0,134,191,1);
  color: rgba(255, 255, 255, .9);
  font-weight: bold;
  padding: .5em;
  width: auto;
}
.header-nota .btn-nota a:hover{
  background-color: #d9d9d9;
  color: #101820;
}
.info-nota p{
  padding-bottom: 2em;
  padding-top: 2em;
}
#pag-blog{
  align-items: center;
  background: #fff;
  display: flex;
  display: -webkit-flex;
  flex-grow: 1;
  flex-wrap: wrap;
  justify-content: center;
  padding: .5em;
  width: 100%;
}
#pag-blog a{
  align-items: center;
  background-color: transparent;
  border-radius: .5em;
  color: #101820;
  display: flex;
  justify-content: center;
  font-weight: normal;
  margin: .25em;
  /*padding: .75em .5em;*/
}
#pag-blog a:hover{
  color: rgba(0,134,191,1);
}
#pag-blog a.active{
  border: 2px solid rgba(0,134,191,1);
  border-radius: 50%;
  height: 40px;
  line-height: .8em;
  padding: .5em;
  text-align: center;
  width: 40px;
}
#pag-blog a i{
  font-size: 2em;
}
.pag-ext{
  background: rgba(0,134,191,1);
  color: #101820;
}
#categoria-blog, #popular-blog,#busqueda-blog{
  background: #fff;
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 1em 0 0 0;
  width: 100%;
}
#publicidad-blog, #publicidad2-blog{
  background: transparent;
  margin: 0;
  width: 100%;
}
#popular-blog{
  background: none;
  margin: 0 0 1em 0;
}
#busqueda-blog{
  background-color: transparent;
}
.categoria-titulo, .popular-titulo,.busqueda-titulo{
  /*background: rgba(0,134,191,1);*/
  color: #fff;
  flex-grow: 1;
  margin: 0;
  /*text-shadow: 1px 1px 2px rgba(0, 0, 0, .5);*/
  width: 100%;
  padding: .5em;
}
.htenue-2{
  color: rgba(255, 255, 255, .9);
  font-weight: normal;
}
#buscador-blog{
  align-items: center;
  display: flex;
  height: 46px;
  width: 100%;
}
#campo-buscar{
  background-color: rgba(255,255,255,1);
  border-radius: 0 0 0 .75em;
  font-family: "RobotoCondensed";
  font-size: .9em;
  height: 100%;
  margin: 0;
  padding: 0 .5em;
  width: 80%;
}
#btn-buscar{
  background-color: rgba(0,134,191,1);
  border-radius: 0 0 .75em 0;
  color: #fff;
  cursor: pointer;
  height: 100%;
  font-size: 1em;
  width: 20%;
}
a.categoria-link, #popular-blog article{
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #ccc;
  color: #777;
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
  flex-grow: 1;
  font-size: .9em;
  justify-content: space-between;
  margin: .15em 0;
  padding: .5em;
  width: 100%;
}
a.categoria-link:hover, #categoria-blog a.active{
  background: rgba(0, 84, 105, .2);
  color: #005469;
}
#categoria-blog a.active{
  cursor: default;
}
#popular-blog article{
  background: -webkit-linear-gradient(180deg, #fff 10%, #ddd 90%);
  background: -moz-linear-gradient(180deg, #fff 10%, #ddd 90%);
  background: -ms-linear-gradient(180deg, #fff 10%, #ddd 90%);
  background: -o-linear-gradient(180deg, #fff 10%, #ddd 90%);
  background: linear-gradient(180deg, #fff 10%, #ddd 90%);
}
a.categoria-link span{
  align-items: center;
  background-color: rgba(0,134,191,1);
  border-radius: 50%;
  color: rgba(255, 255, 255, 1);
  font-size: .85em;
  font-weight: bold;
  height: 23px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  /*padding: .25em;*/
  width: 23px;
}
.img-popular, .info-popular{
  width: 30%;
}
.img-popular img{
  border-color: #fff;
  border-style: solid;
  border-width: 1px;
}
.info-popular{
  width: 60%;
}
.info-popular h4{
  color: #101820;
  margin: 0;
}
.info-popular p{
  font-size: .8em;
  font-weight: normal;
}
.icono-fecha-destacados{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.icono-fecha-destacados svg{
  margin-right: .5em;
}
.info-popular a{
  background: rgba(0, 84, 105, .2);
  color: #005469;
  font-size: .8em;
  padding: .25em 1em;
}
.info-popular a:hover{
  background: rgba(0, 84, 105, .6);
  color: #fff;
}
.info-popular a.titulo-link-nota{
  background-color: transparent;
  color: #101820;
  font-size: 1em;
  padding: 0;
}
#compartir-nota{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.compartir-iconos{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.compartir-iconos span{
  margin-right: 2px;
}
.compartir-iconos span.stButton{
  height: 33px;
  margin: 0;
}
#info p{font-weight: normal;
}
.azul-claro{
  color: #2980b9;
  font-weight: 600;
}
/*FIN BLOG*/
/*CONTACTO Y METODOS----------------------------------------------------------------------------------------------------*/
.contacto-blanco,.metodos-blanco{
  background-color: #fff;
  display: grid;
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.metodos-blanco:nth-child(3),.metodos-blanco:nth-child(4){
  margin: 4em auto;
}
.contactoform-contactomap,.metodo-payu,.metodo-efectivo,.metodo-consignaciones{
  display: grid;
  grid-gap: 4em;
  grid-template-areas: "contacto-form contacto-map";
  grid-template-columns: 1.2fr .8fr;
  width: 100%;
}
.metodo-payu,.metodo-efectivo,.metodo-consignaciones{
  grid-gap: 2em;
}
.metodo-consignaciones{
  grid-template-columns: .8fr 1.2fr;
}
.contacto-form p:nth-child(2){
  margin-bottom: 1.5em;
}
.contacto-politica{
  border-bottom: none;
}
.contacto-map,.payu-img,.consignaciones-img,.efectivo-img{
  align-items: center;
  display: flex;
  grid-area: contacto-map;
  justify-content: center;
  padding: 2em;
  position: relative;
}
.payu-img{
  grid-area: payu-img;
}
.consignaciones-img{
  grid-area: consignaciones-img;
}
.efectivo-img{
  grid-area: efectivo-img;
}
.map-izq,.map-center,.map-der,.metodo-parte-a,.metodo-parte-c,.metodo-parte-b{
  position: absolute;
}
.map-izq,.map-der,.metodo-parte-a,.metodo-parte-b{
  height: 100%;
  width: 50%;
  z-index: 1;
}
.map-izq,.metodo-parte-a{
  background-color: #fff;
  left: 0;
}
.consignaciones-img .metodo-parte-a{
  background-color: #0086bf;
}
.map-der,.metodo-parte-b{
  background-color: #e5e5e5;
  right: 0;
}
.metodo-parte-b{
  background-color: #0086bf;
}
.consignaciones-img .metodo-parte-b{
  background-color: #fff;
}
.map-center,.metodo-parte-c{
  background-color: #fff;
  border-color: #e5e5e5;
  border-style: solid;
  border-width: 5px;
  /*height: 65%;*/
  width: 100%;
  z-index: 2;
}
.metodo-parte-c{
  box-shadow: 0 0 .5em rgba(16,24,32,.4);
  height: auto;
}
.contacto-repolitica{
  border-color: #666;
  border-style: dashed;
  border-width: 1px;
  margin: 1em auto 0 auto;
  max-width: 1280px;
  padding: 1em;
  width: 95%;
}
.payu-btn{
  background-color: #a6c307;
  border-color: #e5e5e5;
  border-radius: 0 0 .5em 0;
  border-style: solid;
  border-width: 1px;
  color: rgba(255,255,255,1);
  display: flex;
  text-shadow: 0 0 6px rgba(16,24,32,.5);
  justify-content: center;
  max-width: 200px;
  padding: .5em 1em;
}
.map-center{
  border-color: rgba(0,134,191,1);
}
#respuesta-contacto-a{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: auto;
  max-width: 445px;
  width: 100%;
}
#respuesta-contacto{
  background-color: rgba(255, 255, 255, .9);
  border-radius: 1em 0;
  box-shadow: 1px 1px 3px #101820;
  /*margin: auto;
  max-width: 430px;*/
  padding: .5em;
}
.contacto-enviado{
  color: green;
}
.contacto-no-enviado{
  color: red;
}
/*FIN CONTACTO*/
/*ASI TRABAJAMOS Y METODOS---------------------------------------------------------------------------------------*/
.contiene-trabajamos,.contiene-formas{
  display: grid;
  grid-gap: 3em;
  grid-template-areas:
  "publico-txt briefing-txt presupuesto-txt contacto-txt anticipo-txt"
  "boceto-txt desarrollo-txt informe-txt entrega-txt saldo-txt";
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(2, 1fr);
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.contiene-formas{
  grid-template-areas:
  "punico-txt pmitimiti-txt pmensual-txt";
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 1fr;
}
.contiene-metodos{
  width: 100%;
}
.trabajamos-txt i{
  color: #101820;
  font-size: 3em;
}
.trabajamos-txt:nth-child(1),.trabajamos-txt:nth-child(2),.trabajamos-txt:nth-child(3),.trabajamos-txt:nth-child(4),
.trabajamos-txt:nth-child(5),.trabajamos-txt:nth-child(6),.trabajamos-txt:nth-child(7),.trabajamos-txt:nth-child(8),
.trabajamos-txt:nth-child(9),.trabajamos-txt:nth-child(10),
.formas-txt:nth-child(1),.formas-txt:nth-child(2),.formas-txt:nth-child(3){
  background-color: #e5e5e5;
  border-bottom-color: #ccc;
  border-left-color: #ccc;
  border-right-color: #ccc;
  border-top-color: #0086bf;
  border-radius: .5em;
  border-style: solid;
  border-width: 2px;
  grid-area: publico-txt;
  padding: .5em;
  position: relative;
  text-align: center;
}
.trabajamos-txt:nth-child(1),.trabajamos-txt:nth-child(2),.trabajamos-txt:nth-child(3),.trabajamos-txt:nth-child(4),
.trabajamos-txt:nth-child(5),.trabajamos-txt:nth-child(6),.trabajamos-txt:nth-child(7),.trabajamos-txt:nth-child(8),
.trabajamos-txt:nth-child(9),.trabajamos-txt:nth-child(10){
  /*background-image: url(../images/publico.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;*/
}
.trabajamos-txt:nth-child(2){
  grid-area: briefing-txt;
}
.trabajamos-txt:nth-child(3){
  grid-area: presupuesto-txt;
}
.trabajamos-txt:nth-child(4){
  grid-area: contacto-txt;
}
.trabajamos-txt:nth-child(5){
  grid-area: anticipo-txt;
}
.trabajamos-txt:nth-child(6){
  grid-area: boceto-txt;
}
.trabajamos-txt:nth-child(7){
  grid-area: desarrollo-txt;
}
.trabajamos-txt:nth-child(8){
  grid-area: informe-txt;
}
.trabajamos-txt:nth-child(9){
  grid-area: entrega-txt;
}
.trabajamos-txt:nth-child(10){
  grid-area: saldo-txt;
}
.trabajamos-txt h3{
  color: #101820;
  margin-top: 0;
}
.formas-txt i{
  font-size: 3em;
}
.formas-txt:nth-child(1){
  grid-area: punico-txt;
}
.formas-txt:nth-child(2){
  grid-area: pmitimiti-txt;
}
.formas-txt:nth-child(3){
  grid-area: pmensual-txt;
}
.contiene-trabajamos article svg,.contiene-formas article svg{
  color: #0086bf;
  font-size: 3em;
  margin: .15em 0;
}
.numero-trabajamos,.numero-formas{
  align-items: center;
  background-color: #0086bf;
  border-color: #fff;
  border-radius: 50%;
  border-style: dashed;
  border-width: 1px;
  box-shadow: 1px 1px 3px 1px #999;
  color: #fff;
  display: flex;
  font-weight: bold;
  justify-content: center;
  height: 2em;
  position: absolute;
  right: -1em;
  top: 0;
  width: 2em;
}
.numero-formas{
  /*right: 50%;*/
  top: -1em;
}
.formas-txt h3{
  background-color: rgba(16,24,32,.5);
  color: #fff;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: .25em;
  width: 100%;
}
.metodo-payu{
  grid-template-areas: "payu-txt payu-img";
  text-align: justify;
}
.metodo-consignaciones{
  grid-template-areas: "consignaciones-img consignaciones-txt";
  text-align: justify;
}
.metodo-efectivo{
  grid-template-areas: "efectivo-txt efectivo-img";
  text-align: justify;
}
.contacto-form{
  grid-area: contacto-form;
  padding: 2em;
}
.payu-txt{
  grid-area: payu-txt;
  padding: 2em;
}
.payu-img{
  grid-area: payu-img;
  padding: 2em;
}
.efectivo-txt{
  grid-area: efectivo-txt;
  padding: 2em;
}
.efectivo-img{
  grid-area: efectivo-img;
  padding: 2em;
}
.consignaciones-txt{
  grid-area: consignaciones-txt;
  padding: 2em;
}
.consignaciones-img{
  grid-area: consignaciones-img;
  padding: 2em;
}
#contenedor-metodos .payu-txt h2,#contenedor-metodos .efectivo-txt h2,#contenedor-metodos .consignaciones-txt h2{
  font-size: 2em;
  margin-bottom: 1em;
  text-align: left;
}
/*GENERAR CONTENIDO DENTRO DE UN ELEMENTO HTML.................................................................................
.numero-trabajamos::before{
  content: "1";
}*/
/*FIN ASI TRABAJAMOS Y METODOS*/
/*PREGUNTAS FRECUENTES-----------------------------------------------------------------------------------*/
.contiene-preguntas{
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.button.is-fullwidth {
  display: flex;
  width: 100%;
}
.button.is-medium {
    font-size: 1em;
}
.button.is-primary {
    background-color: rgba(51,51,51,.2);
    border-color: transparent;
    color: rgba(16,24,32,.8);
    font-family: "RobotoCondensed";
}
.numero-pregunta{
  align-items: center;
  background-color: rgba(0,134,191,1);
  border-radius: 4px 0 0 4px;
  border-right-color: rgba(0,204,0,1);
  border-right-style: solid;
  border-right-width: 2.5px;
  color: #fff;
  display: flex;
  font-weight: bold;
  height: 100%;
  justify-content: center;
  min-width: 2.3em;
  padding: .5em;
  position: absolute;
}
.contiene-preguntas .button {
    /*background-color: #fff;*/
    /*border-color: #dbdbdb;*/
    border-width: 1px;
    /*color: #363636;*/
    cursor: pointer;
    display: flex;
    justify-content: flex-start;
    /*padding-bottom: calc(.375em - 1px);
    padding-left: .75em;*/
    /*padding-right: .75em;*/
    padding-right: 1em;
    /*padding-top: calc(.375em - 1px);
    text-align: center;
    white-space: nowrap;*/
    -moz-appearance: none;
    -webkit-appearance: none;
    align-items: center;
    /*border: 1px solid transparent;*/
    border-radius: 4px;
    box-shadow: none;
    /*display: inline-flex;
    font-size: 1rem;
    height: 2.25em;
    justify-content: flex-start;
    line-height: 1.5;
    padding-bottom: calc(.375em - 1px);
    padding-left: calc(.625em - 1px);
    padding-right: calc(.625em - 1px);
    padding-top: calc(.375em - 1px);*/
    position: relative;
    vertical-align: top;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /*margin: 0;*/
    margin-bottom: .5em;
}
.contiene-preguntas .button p{
  margin-left: 2.8em;
  padding: .5em;
  text-align: left;
}
.contiene-preguntas .button.is-primary.is-focused:not(:active), .contiene-preguntas .button.is-primary:focus:not(:active) {
    box-shadow: 0 0 0 0.125em rgba(0,209,178,.25);
}
.contiene-preguntas .button.is-primary.is-active, .contiene-preguntas .button.is-primary:active {
    background-color: rgba(0,134,191,1);
    border-color: transparent;
    color: #101820;
}
.contiene-preguntas .button.is-primary.is-focused, .contiene-preguntas .button.is-primary:focus {
    border-color: transparent;
    color: #101820;
}
.contiene-preguntas .button.is-primary.is-hovered, .button.is-primary:hover {
    background-color: rgba(0,134,191,1);
    border-color: transparent;
    color: #101820;
}
.contiene-preguntas .pregunta-b-btn,.contiene-preguntas .pregunta-c-btn{
  background-color: #ccc;
  box-shadow: 0 0 0 0.125em rgba(0,209,160,.5);
  border-color: transparent;
  color: rgba(16,24,32,.75);
  padding: .5em;
}
.form-preguntas{
  background-color: #fff;
  margin: auto;
  max-width: 1280px;
  padding-top: 3em;
  width: 90%;
}
#contenedor-preguntas .form-preguntas h2{
  margin-bottom: 0;
}
.politica-preguntas{
  border-color: #666;
  border-style: dashed;
  border-width: 1px;
  margin: 1em auto 0 auto;
  padding: 1em;
  width: 100%;
}
/*FIN PREGUNTAS FRECUENTES*/
/*ÚLTIMAS NOVEDADES AVISOS LEGALES............*/
.flipbox-wrapper {perspective: 764px; perspective-origin: 50% 50%;}
.flipbox-wrapper .flipbox-box {position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition-property: transform;}
.flipbox-wrapper .flipbox-box .flipbox-side {position: absolute; width: 100%; height: 100%; backface-visibility: hidden;}
.flipbox-wrapper .flipbox-box .flipbox-side.flipbox-front {transform: translateZ(0);}
.flipbox-wrapper .flipbox-box .flipbox-side.flipbox-left {transform-origin: center left;}
.flipbox-wrapper .flipbox-box .flipbox-side.flipbox-right {transform-origin: top right;}
.flipbox-wrapper .flipbox-box .flipbox-side.flipbox-top {transform-origin: top center;}
.flipbox-wrapper .flipbox-box .flipbox-side.flipbox-bottom {transform-origin: bottom center;}
/*-----------------------------------*/
.item {display: inline-block; /*margin: 30px 40px;*/ text-align: center; vertical-align: top; font-size: 0;}
.box {
  width: 100%;
  /*min-width: 382px;
  min-height: 250px;*/
  position: relative;
  /*margin: 1em 0;*/
  font-size: initial;
  text-align: justify;
}
.box p{
  border-color: #ddd;
  border-radius: .3em;
  border-style: solid;
  border-width: 1px;
  margin-bottom: .5em;
  padding: 1em;
}
.box .side {/*line-height: 260px; font-size: 1.5em; font-weight: 700;*/ color: #fff; text-align: center; user-select: none;}
/*.box .side.side1 {background: #3366CC;}
.box .side.side2 {background: #DC3912;}
.box .side.side3 {background: #FF9900;}
.box .side.side4 {background: #109618;}
.box .side.side5 {background: #990099;}
.box .side.side6 {background: #3B3EAC;}
.box .side.side7 {background: #0099C6;}
.box .side.side8 {background: #DD4477;}*/
.box a:hover .nota-img-legales img{
  opacity: .5;
}
.nota-img-legales{
  position: absolute;
  z-index: 1;
}
.nota-img-legales img{
  vertical-align: top;
}
.nota-txt-legales{
  background-color: rgba(16,24,32,.7);
  height: 100%;
  position: relative;
  width: 100%;
  z-index: 2;
}
.nota-txt-legales h3{
  margin: 0;
  padding: .5em 0;
}
.nota-btn-legales{
  margin: 2em auto 0 auto;
  text-align: center;
  width: 100%;
  z-index: 3;
}
.nota-btn-legales a{
  background-color: transparent;
  border-color: #0086bf;
  border-style: solid;
  border-width: 1px;
  color: #0086bf;
  padding: .5em 1em;
  position: relative;
}
.nota-btn-legales a:hover{
  background-color: #0086bf;
  color: #fff;
}
/*FIN ÚLTIMAS NOVEDADES AVISOS LEGALES--------*/
/*FIN LEGAL--------------------------------------------------------------------------*/
/*SERVICIOS PRINCIPALES----------------------------------------------------------------------------*/
.contiene-disenos{
  align-self: start;
  display: grid;
  grid-gap: 2em;
  grid-template-areas:
      "diseno-grafico-img diseno-grafico-txt diseno-grafico-txt diseno-grafico-ali"
      "diseno-grafico-title diseno-grafico-title diseno-grafico-title diseno-grafico-title"
      "imagen-identidad diseno-publicitario diseno-editorial gran-formato"
      "souvenirs packaging fotografia ilustracion";
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: max-content max-content repeat(2, 1fr);
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.diseno-grafico-img{
  background-image: url(../images/diseno-grafico.jpg);
  border-color: rgba(255,255,255,1);
  border-style: solid;
  border-width: 3px;
  grid-area: diseno-grafico-img;
  height: 100%;
}
.diseno-grafico-txt{
  background: -webkit-linear-gradient(left, #DF7401, #f7b146);
  /*background-color: #DF7401;*/
  border-bottom-color: #101820;
  border-bottom-style: dashed;
  border-bottom-width: 1px;
  border-radius: .5em 2em 0 1em;
  color: #101820;
  grid-area: diseno-grafico-txt;
  padding: 1em;
}
.diseno-grafico-ali{
  grid-area: diseno-grafico-ali;
  text-align: center;
}
.diseno-grafico-title{
  grid-area: diseno-grafico-title;
  text-align: center;
}
.contiene-disenos h2{
  margin: 1rem 0;
  padding: 0 1rem;
}
.diseno-grafico-title h2{
  font-size: 3em;
  padding: 0;
}
.contiene-disenos p{
  padding: 0 1rem; 
}
.diseno-grafico-img{
  background-position: center;
  background-size: cover;
}
.linea-blanca-serv{
  border-color: rgba(255,255,255,.4);
  border-style: dashed;
  border-width: 1px;
  margin-bottom: .5em;
}
.imagen-identidad,.diseno-publicitario,.diseno-editorial,.gran-formato,.souvenirs,.packaging,.fotografia,
.ilustracion{
  align-items: flex-start;
  background-color: #fff;
  box-shadow: 3px 3px 15px rgba(16,24,32,.1);
  display: flex;
  flex-wrap: wrap;
  min-height: 100%;
  /*padding: 1em;*/
}
.imagen-identidad{
  grid-area: imagen-identidad;
}
.diseno-publicitario{
  grid-area: diseno-publicitario;
}
.diseno-editorial{
  grid-area: diseno-editorial;
}
.gran-formato{
  grid-area: gran-formato;
}
.souvenirs{
  grid-area: souvenirs;
}
.packaging{
  grid-area: packaging;
}
.fotografia{
  grid-area: fotografia;
}
.ilustracion{
  grid-area: ilustracion;
}
ul.lista-servicios,ul.lista-servicios-b{
  font-size: .9em;
  padding: 0 1rem;
  width: 100%;
}
ul.lista-servicios li,ul.lista-servicios-b li{
  margin-left: 1em;
}
.descripcion ul li {
  list-style: none;
  margin-left: 0;
  padding: 6px 0;
  border-bottom: 1px solid rgba(16,24,32,.2);
}
ul.lista-servicios li:before,ul.lista-servicios-b li:before{
  color: #00c853;
  content: "\f00c"; /* FontAwesome Unicode */
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  margin-left: -1.3em;
  margin-right: .5em;
  width: 1.3em;
}
.pa-btn-presupuestar{
  margin: 1.5em 0;
  padding: 0 1rem;
  text-align: center;
  width: 100%;
}
a.presupuestar-btn{
  background-color: transparent;
  border-color: rgba(0,134,191,1);
  border-radius: 0 .5em 0 .3em;
  border-style: solid;
  border-width: 1px;
  color: rgba(0,134,191,1);
  font-size: .85em;
  padding: .5em;
  text-transform: uppercase;
}
a.presupuestar-btn:hover{
  background-color: rgba(0,134,191,1);
  color: rgba(255,255,255,.8);
}
/*MULTIMEDIA--------------------------------------------------------*/
.contiene-multimedia{
  /*align-items: flex-start;*/
  align-self: start;
  display: grid;
  grid-gap: 2em;
  grid-template-areas:
      "multimedia-vdo multimedia-vdo multimedia-txt multimedia-txt"
      "multimedia-title multimedia-title multimedia-title multimedia-title"
      "multi-educativa multi-publicitaria multi-comercial multi-informativa";
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: max-content max-content 1fr;
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.multimedia-txt{
  background: -webkit-linear-gradient(left, #009FE3, #0086bf);
  /*background-color: #c4302b;*/
  padding: 1em;
}
.multimedia-vdo{
  grid-area: multimedia-vdo;
}
.multimedia-txt{
  grid-area: multimedia-txt;
}
.multimedia-title{
  grid-area: multimedia-title;
}
.contiene-multimedia h2{
  margin: 1rem 0;
}
h2.subtitulo-multimedia{
  color: rgba(255,255,255,1);
  text-align: center;
}
.contiene-multimedia h3{
  color: rgba(255,255,255,1);
}
.multi-educativa{
  grid-area: multi-educativa;
}
.multi-educativa video{
  border-bottom-color: orange;
}
.multi-publicitaria{
  grid-area: multi-publicitaria;
}
.multi-publicitaria video{
  border-bottom-color: purple;
}
.multi-comercial{
  grid-area: multi-comercial;
}
.multi-comercial video{
  border-bottom-color: green;
}
.multi-informativa{
  grid-area: multi-informativa;
}
.multi-informativa video{
  border-bottom-color: red;
}
.multi-educativa video,.multi-publicitaria video,.multi-comercial video,.multi-informativa video{
  border-bottom-style: solid;
  border-bottom-width: 3px;
}
/*MARKETING-------------------------------------------------------------------*/
.contiene-marketing{
  /*align-items: flex-start;*/
  align-self: start;
  display: grid;
  grid-gap: 2em;
  grid-template-areas:
      "marketing-txta marketing-img marketing-txtb"
      "marketing-title marketing-title marketing-title"
      "marketing-contenidos video-marketing e-marketing"
      "redes-sociales posicionamiento-seo analitica-web"
      "publicidad-online consultoria relacionamiento";
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: max-content max-content;
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.contiene-marketing h2{
  margin: 1rem 0;
  padding: 0 1rem;
  width: 100%;
}
.contiene-marketing p{
  padding: 0 1rem;
  width: 100%;
}
.contiene-marketing a{
  margin: 0 1rem;
}
.marketing-txta,.marketing-txtb{
  /*background: -webkit-linear-gradient(left, rgba(76,166,83,1), #30a227);*/
  background-color: #fff;
  border-bottom-color: #101820;
  border-bottom-style: dashed;
  border-bottom-width: 1px;
  border-radius: .5em 2em 0 1em;
  /*color: #101820;*/
  grid-area: marketing-txta;
  padding: 1em;
}
.marketing-img{
  align-items: center;
  background-color: rgba(255,255,255,1);
  /*background-image: url(../img/marketing-digital.png);
  background-color: rgba(255,255,255,1);
  background-position: center;
  background-size: cover;
  border-color: rgba(255,255,255,1);
  border-style: solid;
  border-width: 3px;*/
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  grid-area: marketing-img;
  height: 100%;
}
.marketing-txtb{
  grid-area: marketing-txtb;
}
.marketing-title{
  grid-area: marketing-title;
  text-align: center;
}
.contiene-marketing .marketing-title{
  background-color: transparent;
  margin: 1rem 0;
}
.marketing-txtb ul.lista-servicios li:before{
  color: #0086bf;
}
.marketing-contenidos,.video-marketing,.e-marketing,.redes-sociales,
.posicionamiento-seo,.analitica-web,.publicidad-online,.consultoria,.relacionamiento{
  align-items: flex-start;
  background-color: rgba(255,255,255,1);
  box-shadow: 3px 3px 15px rgba(16,24,32,.1);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding-bottom: 1rem;
}
.marketing-contenidos{
  grid-area: marketing-contenidos;
}
.marketing-contenidos img{
  border-bottom-color: orange;
}
.video-marketing{
  grid-area: video-marketing;
}
.video-marketing img{
  border-bottom-color: red;
}
.e-marketing{
  grid-area: e-marketing;
}
.e-marketing img{
  border-bottom-color: green;
}
.redes-sociales{
  grid-area: redes-sociales;
}
.redes-sociales img{
  border-bottom-color: rgba(0,134,191,1);
}
.posicionamiento-seo{
  grid-area: posicionamiento-seo;
}
.posicionamiento-seo img{
  border-bottom-color: green;
}
.analitica-web{
  grid-area: analitica-web;
}
.analitica-web img{
  border-bottom-color: red;
}
.publicidad-online{
  grid-area: publicidad-online;
}
.publicidad-online img{
  border-bottom-color: purple;
}
.consultoria{
  grid-area: consultoria;
}
.consultoria img{
  border-bottom-color: violet;
}
.relacionamiento{
  grid-area: relacionamiento;
}
.relacionamiento img{
  border-bottom-color: yellow;
}
.marketing-contenidos img,.video-marketing img,.e-marketing img,.redes-sociales img,
.posicionamiento-seo img,.analitica-web img,.publicidad-online img,.consultoria img,
.relacionamiento img{
  border-bottom-style: solid;
  border-bottom-width: 4px;
  width: 100%;
}
/*EVENTOS-------------------------------------------------------------------------*/
.contiene-eventos{
  background-color: #fff;
  padding: 3em 0;
}
.contiene-eventos .ancho-max{
  align-items: center;
}
.eventos-txt,.eventos-img{
  width: 47%;
}
.eventos-txt h2{
  font-size: 3em;
}
.eventos-img img{
  border: 2px solid #101820;
  border-radius: 1em;
  padding: .5em;
}
.listado-eventos li::before {
    font-family: "Font Awesome 5 Free";
    color: #0086bf;
    content: "\f274";
    margin-right: 8px;
}
.contiene-eventos .complemento-evento{
  align-items: flex-start;
  border-top: 4px double #0086bf;
  margin-top: 5em;
  padding-top: 5em;
}
.complemento-evento h2{
  font-size: 3em;
  text-align: center;
  width: 100%;
}
.complemento-evento h3{
  font-size: 1.8em;
}
.logistica-evento,.landing-evento,.promocion-evento{
  width: 31%;
}
.listado-eventos-b li{
  background-color: #eee;
  border-radius: .75em;
  margin: .25em;
  padding: .25em;
}
.listado-eventos-b li::before {
    font-family: "Font Awesome 5 Free";
    color: #0086bf;
    content: "\f058";
    margin-right: 8px;
}
/*FIN EVENTOS*/
/*SITIOS WEB----------------------------------------------------------------------*/
.sitio-basico,.sitio-corporativo,.e-commerce,.e-learning,.portal-inmobiliario,
.portal-noticias,.portal-reservas,.bolsa-empleo,.landing,.entretenimiento,.cms-mantenimiento,
.actual-nuevo{
  align-items: center;
  background-attachment: fixed;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  height: 100%;
  margin: 0;
  /*padding: 3em 1em;*/
  position: relative;
  width: 100%;
}
.sitio-basico{
  background-image: url(../images/sitio-basico.jpg);
}
.sitio-corporativo{
  background-image: url(../images/sitio-corporativo.jpg);
}
.e-commerce{
  background-image: url(../images/e-commerce.jpg);
}
.e-learning{
  background-image: url(../images/e-learning.jpg);
}
.portal-noticias{
  background-image: url(../images/portal-de-noticias.jpg);
}
.portal-reservas{
  background-image: url(../images/portal-de-reservas.jpg);
}
.bolsa-empleo{
  background-image: url(../images/bolsa-de-empleo.jpg);
}
.portal-inmobiliario{
  background-image: url(../images/portal-inmobiliario.jpg);
}
.landing{
  background-image: url(../images/landing-page.jpg);
}
.entretenimiento{
  background-image: url(../images/portal-de-entretenimiento.jpg);
}
.diseno-web,.responsive,.psd-html{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: auto;
  max-width: 1280px;
  width: 90%;
}
.responsive,.psd-html{
  padding-bottom: 2em;
}
.diseno-web-txt,.responsive-txt,.psd-html-txt{
  /*background: -webkit-linear-gradient(left, #eee, #ddd);*/
  /*background-color: #DF7401;*/
  border-bottom-color: #101820;
  border-bottom-style: dashed;
  border-bottom-width: 1px;
  border-radius: .5em 2em 0 1em;
  padding: 1em;
  width: 47%;
}
.psd-html-txt{
  background: transparent;
  color: rgba(16,24,32,1);
}
.titulo-psd{
  font-size: 3em;
}
.diseno-web-img,.responsive-img,.psd-html-img{
  /*background-image: url(../images/diseno-grafico.jpg);*/
  border-color: rgba(255,255,255,1);
  border-style: solid;
  border-width: 3px;
  width: 47%;
}
.diseno-web-title{
  margin-bottom: 3em;
  margin-top: 3em;
  text-align: center;
  width: 100%;
}
.contiene-sitio-basico,.contiene-sitio-corporativo,.contiene-e-commerce,.contiene-e-learning,
.contiene-portal-inmobiliario,.contiene-portal-noticias,.contiene-portal-reservas,.contiene-bolsa-empleo,
.contiene-landing,.contiene-entretenimiento,.contiene-cms-mantenimiento,.contiene-actual-nuevo{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 2em 0;
  max-width: 1280px;
  width: 90%;
}
.contiene-sitio-basico,.contiene-e-commerce,.contiene-portal-inmobiliario,.contiene-portal-reservas,
.contiene-landing{
  justify-content: flex-end;
}
.contiene-cms-mantenimiento{
  align-items: flex-start;
}
.servicio-web-vacio,.sitio-basico-txt,.sitio-corporativo-txt,.e-commerce-txt,.e-learning-txt,
.portal-inmobiliario-txt,.portal-noticias-txt,.portal-reservas-txt,.bolsa-empleo-txt,.landing-txt,
.entretenimiento-txt,.cms-txt,.mantenimiento-txt,.actual-txt,.nuevo-txt{
  background-color: rgba(255,255,255,.85);
  border-color: rgba(255,255,255,1);
  border-style: solid;
  border-width: 3px;
  color: rgba(16,24,32,1);
  /*margin-bottom: 2em;*/
  padding: 2em;
  width: 45%;
  z-index: 3;
}
/*.servicio-web-vacio{
  background-color: transparent;
  border: none;
  padding: 0;
}*/
/*MOBILE-RESPONSIVE*/
.actual-nuevo{
  align-items: flex-start;
  background-color: #e5e5e5;
  height: auto;
}
#contenedor-responsive{
  padding: 3em 0 0 0;
}
.contiene-actual-nuevo{
  align-items:stretch;
  margin: 2em 0 3em 0;
}
.actual-txt,.nuevo-txt{
  background-color: rgba(255,255,255,1);
  color: #666;
  width: 47%;
}
.actual-txt img,.nuevo-txt img{
  margin-bottom: 1em;
}
.presupuestar-mobile{
  align-items: center;
  background-color: rgba(0,134,191,1);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  cursor: pointer;
  margin: 2em auto 0 auto;
  padding: 0;
  transition: all .7s;
}
.presupuestar-mobile:hover{
  background-color: transparent;
  border-color: rgba(0,134,191,1);
}
.presupuestar-mobile a{
  color: #101820;
  padding: .8rem 2rem;
  width: 100%;
}
.psd-btn{
  margin: auto;
  max-width: 240px;
  text-align: center;
  width: 100%;
}
/*FIN MOBILE-RESPONSIVE*/
/*FIN DE LOS SERVICIOS PRINCIPALES*/
/*DISEÑO UX/UI-----------------------------------------------------------------------*/
.ux-img{
  border-radius: 2em;
  box-shadow: 2px 3px 6px rgba(0, 0, 0, .2);
  padding: .5em;
}
.titulo-ux-ui,.titulo-delo-ux{
  font-size: 3em;
}
.titulo-delo-ux{
  text-align: center;
  margin: 1em 0;
  width: 100%;
}
.actual-txt, .nuevo-txt{
  margin-bottom: 3em;
}
/*FIN DISEÑO UX/UI*/
/*PSD A HTML5------------------------------------------------------------------------*/
.html-css-js{
  margin: 5em auto;
}
.html-css-js i{
  font-size: 5em;
  text-align: center;
  width: 100%;
}
.html-txt,.css-txt,.js-txt{
  border: 2px solid #666;
  border-radius: 1em;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 1em;
  width: 30%;
}
.html-css-js .titulo-psdb {
    position: relative;
    margin: 1rem 0 0;
}
.html-css-js .titulo-psdb:first-of-type:before{
  content: "";
  position: absolute;
  height: 5px;
  background: #0086bf;
  width: 2em;
  bottom: -0.75rem;
  border-radius: 3px;
}
.titulo-psdb,.psd-txt{
  text-align: center;
  width: 100%;
}
.html-css-js p{
  margin-top: 2em;
}
/*FIN PSD A HTML5*/
/*SUSCRIPCIÓN------------------------------------------------------------------------*/
.widget_blog_subscription {
  /*display: block;
  margin: 50px auto;
  width: 60%;
  max-width: 490px;
  min-width: 320px;
  position: relative;
  overflow: hidden;
  background-color: #F6F6F2;
  border-radius: 10px;*/
}
.widget_blog_subscription:after,
.widget_blog_subscription:before {
  /*content: '';
  width: 100%;
  height: 10px;
  display: block;
  background-image: repeating-linear-gradient(135deg, #F29B91 0px, #F09290 15px, transparent 15px, transparent 25px, #83B3DB 25px, #84ADCB 40px, transparent 40px, transparent 50px);*/
}

.widget_blog_subscription p {
  margin: 0;
  text-align: left;
}
.widget_blog_subscription p:first-child {
  /*margin: 30px 30px 15px;
  color: #83B3DB;
  text-transform: uppercase;
  text-align: left;
  font-size: 15px;
  letter-spacing: 1px;*/
}
.widget_blog_subscription .subscribe-blog:before {
  /*content: '>>>>>';
  width: auto;
  height: auto;
  display: block;
  border: 2px solid rgba(242, 155, 145, 0.5);
  padding: 4px;
  position: absolute;
  top: 36px;
  right: -30px;
  color: rgba(242, 155, 145, 0.5);
  font-size: 28px;
  transform: rotate(17deg);
  font-weight: 400;
  text-decoration: underline;
  border-radius: 10px;*/
}
.widget_blog_subscription .subscribe-blog:after {
  /*content: '&';
  width: 50px;
  height: 50px;
  display: block;
  border: 4px double rgba(242, 155, 145, 0.5);
  padding: 10px;
  position: absolute;
  bottom: 30px;
  right: -10px;
  color: rgba(242, 155, 145, 0.5);
  font-size: 50px;
  transform: rotate(-30deg);
  font-weight: 400;
  border-radius: 99px;
  text-align: center;
  line-height: 50px;*/
}
.widget_blog_subscription input[type="text"],
.widget_blog_subscription input[type="tel"],
.widget_blog_subscription input[type="email"],
.widget_blog_subscription select,
.widget_blog_subscription textarea {
  /*margin: .5em 0;*/
  color: #fff;
  /*padding: 14px 7px !important;*/
  /*text-align: left;*/
  width: 100% !important;
  /*max-width: calc(100% - 60px);
  outline: none;
  border: 0;*/
  font-size: .9em;
  background-color: transparent;
  /*border-top: 1px solid #83B3DB;*/
  border-bottom: 1px solid #0086BF;
   -moz-transition: background-color 0.5s ease-in-out;
  -o-transition: background-color 0.5s ease-in-out;
  -webkit-transition: background-color 0.5s ease-in-out;
  transition: background-color 0.5s ease-in-out;
}
.widget_blog_subscription select option{
  color: #101820;
}
.widget_blog_subscription input[type="text"]::-webkit-input-placeholder,
.widget_blog_subscription input[type="tel"]::-webkit-input-placeholder,
.widget_blog_subscription input[type="email"]::-webkit-input-placeholder {
    color: rgba(255,255,255,.7);
}
.widget_blog_subscription input[type="text"]:-moz-placeholder,
.widget_blog_subscription input[type="tel"]:-moz-placeholder,
.widget_blog_subscription input[type="email"]:-moz-placeholder {
    color: rgba(255,255,255,.7);
}
.widget_blog_subscription input[type="text"]::-moz-placeholder,
.widget_blog_subscription input[type="tel"]::-moz-placeholder,
.widget_blog_subscription input[type="email"]::-moz-placeholder {
    color: rgba(255,255,255,.7);
}
.widget_blog_subscription input[type="text"]:-ms-input-placeholder,
.widget_blog_subscription input[type="tel"]:-ms-input-placeholder,
.widget_blog_subscription input[type="email"]:-ms-input-placeholder {
    color: rgba(255,255,255,.7);
}
.widget_blog_subscription input[type="submit"],.widget_blog_subscription button[type="submit"] {
  margin: 1em 0;
  background-color: rgba(16,24,32,1);
  color: #fff;
  padding: .8em 1em !important;
  text-align: center;
  width: 100%;
  outline: none;
  border: 1px solid rgba(255,255,255,.7);
  /*text-transform: uppercase;*/
  font-size: 1em;
  cursor: pointer;
  -webkit-transition: .7s all ease-in-out;
  -moz-transition: .7s all ease-in-out;
  -o-transition: .7s all ease-in-out;
  transition: .7s all ease-in-out;
  box-shadow: 0px 0px 0px 5px rgba(255,255,255,.2);
}
.widget_blog_subscription input[type="submit"]:hover,.widget_blog_subscription button[type="submit"]:hover {
  /*background-color: rgba(0,134,191,1);*/
  background-color: rgba(16,24,32,.7);
  box-shadow: 0px 0px 0px 5px rgba(0,134,191,1);
}
.widget_blog_subscription input:focus{
  background-color: rgba(16,24,32,.2);
}
/* Option B */
.option-b.widget_blog_subscription {
    background-color: #fffbf0;
}
.option-b.widget_blog_subscription:after,
.option-b.widget_blog_subscription:before {
  content: '';
  width: 100%;
  height: 10px;
  display: block;
  background-image: repeating-linear-gradient(135deg, #eb5f5f 0px, #eb5f5f 15px, transparent 15px, transparent 25px, #8ac26d 25px, #8ac26d 40px, transparent 40px, transparent 50px);
}
.option-b.widget_blog_subscription p:first-child {
  color: #8ac26d;
}
.option-b.widget_blog_subscription input[type="text"] {
  /*border-top: 1px solid #8ac26d;
  border-bottom: 1px solid #8ac26d;*/
}
.option-b.widget_blog_subscription input[type="submit"] {
  background-color: #8ac26d;
  box-shadow: 0px 0px 0px 5px #8ac26d;
}
.option-b.widget_blog_subscription input[type="submit"]:hover {
  background-color: #eb5f5f;
  box-shadow: 0px 0px 0px 5px #eb5f5f;
}
.option-b.widget_blog_subscription .subscribe-blog:before {
  content: '*-* *-* *';
  width: auto;
  height: auto;
  display: block;
  border: 2px solid rgba(138, 194, 109, 0.4);
  padding: 4px;
  position: absolute;
  top: 36px;
  right: -30px;
  color: rgba(138, 194, 109, 0.4);
  font-size: 28px;
  transform: rotate(17deg);
  font-weight: 400;
  text-decoration: underline;
  border-radius: 10px;
}
.option-b.widget_blog_subscription .subscribe-blog:after {
  content: '*';
  width: 50px;
  height: 50px;
  display: block;
  border: 4px double rgba(138, 194, 109, 0.4);
  padding: 10px;
  position: absolute;
  bottom: 30px;
  right: -10px;
  color: rgba(138, 194, 109, 0.4);
  font-size: 120px;
  transform: rotate(-30deg);
  font-weight: 400;
  border-radius: 99px;
  text-align: center;
  line-height: 94px;
  vertical-align: middle;
}
footer#footer-principal p.acepto-footer{
  font-size: .8em;
  margin-bottom: 7px;
  margin-top: 14px;
}
.widget_blog_subscription form,.noticia-titulo,.noticia-recibe{
  margin: auto;
  max-width: 488px;
  width: 100%;
}
.widget_blog_subscription form{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.widget_blog_subscription form input:not([type]),
.widget_blog_subscription form input[type=text]:not(.browser-default),
.widget_blog_subscription form input[type=password]:not(.browser-default), 
.widget_blog_subscription form input[type=email]:not(.browser-default),
.widget_blog_subscription form input[type=url]:not(.browser-default), 
.widget_blog_subscription form input[type=time]:not(.browser-default),
.widget_blog_subscription form input[type=date]:not(.browser-default), 
.widget_blog_subscription form input[type=datetime]:not(.browser-default),
.widget_blog_subscription form input[type=datetime-local]:not(.browser-default), 
.widget_blog_subscription form input[type=tel]:not(.browser-default),
.widget_blog_subscription form input[type=number]:not(.browser-default), 
/*input[type=search]:not(.browser-default), */
.widget_blog_subscription form textarea.materialize-textarea,
.widget_blog_subscription form textarea:not(.browser-default),
.widget_blog_subscription form select:not(.browser-default){
  height: 2.85rem;
}
.widget_blog_subscription form input[type=tel]{
  color: #fff;
}
.doble-campo{
  width: 47%;
}
.unico-campo{
  width: 100%;
}
.noticia-titulo{
  margin: 1rem auto;
}
.mas-info-footer{
  color: rgba(255,255,255,.6);
  font-weight: normal;
}
.politica-suscripcion{
  color: rgba(255,255,255,1);
}
.politica-suscripcion:hover{
  color: rgba(255,255,255,.6);
}
.edad_s,.nedad_s{
  width: 100%;
}
.nedad_s{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.widget_blog_subscription select.despliega-edad{
  width: 30% !important;
}
/*FIN DE SUSCRIPCIÓN*/
.pos-footer{
  align-items: center;
  border-top-color: rgba(255,255,255,.5);
  border-top-style: dashed;
  border-top-width: 1px;
  color: rgba(16,24,32,.3);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 1.5em 0;
  padding-top: 1em;
  position: relative;
  width: 100%;
  z-index: 2;
}
.contiene-derechos{
  width: 100%;
}
.contiene-derechos p{
  text-align: center;
  width: 100%;
}
.derechos{
  grid-area: derechos;
}
.derechos img{
  /*border-color: rgba(0,134,191,1);
  border-style: solid;
  border-radius: 50%;
  border-width: 3px;
  height: 200px;*/
  margin: 1.3rem 0;
  /*width: 200px;*/
}
.logo-footer{
  margin: .5em auto;
  text-align: center;
  width: 100%;
}
.logo-footer img{
  max-height: 50px;
}
.pos-footer a{
  color: rgba(255,255,255,1);
  font-size: .8em;
}
.pos-footer a:hover{
  color: #007bff;
}
.linea-ver-footer{
  margin-left: 1em;
  margin-right: 1em;
}
/*FIN REJILLA HOME*/
/*INGRESO USUARIOS Y ESTUDIANTES----------------------------------------------------------------------------------*/
.txt-rt{text-align:right;}/* text align right */
.txt-lt{text-align:left;}/* text align left */
.txt-center{text-align:center;}/* text align center */
.float-rt{float:right;}/* float right */
.float-lt{float:left;}/* float left */
.clear{clear:both;}/* clear float */
.pos-relative{position:relative;}/* Position Relative */
.pos-absolute{position:absolute;}/* Position Absolute */
.vertical-base{ vertical-align:baseline;}/* vertical align baseline */
.vertical-top{  vertical-align:top;}/* vertical align top */
nav.vertical ul li{ display:block;}/* vertical menu */
nav.horizontal ul li{ display: inline-block;}/* horizontal menu */
/*-- slide --*/
@keyframes slideleft {
    from {
        background-position: 0%;
    }
    to {
        background-position: 90000%;
    }
}
@-webkit-keyframes slideleft {
    from {
        background-position: 0%;
    }
    to {
        background-position: 90000%;
    }
}
.w3layouts-main{
    background-image: url('../images/bg.jpg');
    background-repeat: repeat-x;
    animation: slideleft 20000s infinite linear;
    -webkit-animation: slideleft 20000s infinite linear;
    background-size: cover;
  -webkit-background-size:cover;
  -moz-background-size:cover; 
    background-attachment: fixed;
    position: relative;
  min-height: 100vh;
}
.bg-layer {
    background: rgba(0, 0, 0, 0.7);
  min-height: 100vh;
}
.bg-layer h1{
  color: #fff;
  font-size: 3em;
  margin: 0;
  padding: .5em 0;
  text-align: center;
  text-shadow: 1px 1px 3px #101820;
  text-transform: uppercase;
}
/*-- //slide --*/
/*Formulario LOGIN USUARIOS*/
.form-login-usuario{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}
.form-login-usuario img{
  max-width: 120px;
  margin-bottom: 1em;
}
/*-----------------------------------------------*/

.form-login-usuario .login-page {
  width: 100%;
  padding: .25em 0 0 0;
  margin: auto;
}
.form-login-usuario .form {
  position: relative;
  z-index: 1;
  /*background: #FFFFFF;*/
  width: 100%;
  /*margin: 0 auto 100px;
  padding: 45px;*/
  text-align: center;
  /*box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);*/
}
.form-login-usuario .form input {
  background-color: #fff;
  color: #777;
  font-family: "Roboto", sans-serif;
  outline: 0;
  width: 100%;
  /*margin: 0 0 15px;*/
  padding: 15px 15px 15px 40px;
  box-sizing: border-box;
  font-size: .9em;
  transition: background-color 0.5s ease-in-out;
}
.form-login-usuario .form input:focus {
  background-color: rgba(16,24,32,.2);
  color: #fff;
}
.form-login-usuario #nombreu,.form-login-usuario #apellidou,.form-login-usuario #telefonou,.form-login-usuario #correou,
.form-login-usuario #passu,.form-login-usuario #passub{
  background-image: url(../clientes/img/nit-o-cc.png);
  background-position: left .5em center;
  background-repeat: no-repeat;
  margin-bottom: 1em;
}
.form-login-usuario #passu,.form-login-usuario #passub{
  background-image: url(../clientes/img/codigo-pw.png);
}
.cont_list_select_mate {
  position: relative;
  float: left;
  width: 100%;
}
.cont_select_int {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 999;
  overflow: hidden;
  height: 0px;
  width: 100%;
  background-color: #fff;
  padding: 0px;
  margin-bottom: 0px;
  margin-top: 0px;
  border-radius: 0px 0px 3px 3px;
  box-shadow: 1px 4px 10px -2px rgba(0, 0, 0, 0.2);
  transition: all 375ms ease-in-out;
}
.cont_select_int li {
  position: relative;
  float: left;
  font-size: .85em;
  width: 100%;
  border-bottom: 1px solid #E0E0E0;
  background-color: #F5F5F5;
  list-style-type: none;
  padding: 10px 2%;
  margin: 0px;
  transition: all 275ms ease-in-out;
  display: block;
  cursor: pointer;
}
.cont_select_int li:last-child {
  border-radius: 3px;
  border-bottom: 0px;
}
.cont_select_int li:hover {
  background-color: rgba(0,134,191,1);
  color: rgba(255,255,255,1);
}
.cont_select_int .active {
  background-color: #DEDEDE;
}
/* etiqueta <p> con la opcion selecionada  */
.selecionado_opcion {
  padding: .7rem 1rem;
  width: 96%;
  display: block;
  font-size: .9em;
  margin: 0px;
  cursor: pointer;
  text-align: left;
}
/*Otro checkox del presupuesto*/
.cbx {
  margin: auto;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
}
.cbx span {
  display: inline-block;
  vertical-align: middle;
  transform: translate3d(0, 0, 0);
}
.cbx span:first-child {
  position: relative;
  width: 18px;
  height: 18px;
  border-radius: 3px;
  transform: scale(1);
  vertical-align: middle;
  border: 1px solid #9098A9;
  transition: all 0.2s ease;
}
.cbx span:first-child div {
  color: #fff;
  font-weight: normal;
  position: absolute;
  top: 0;
  left: 0;
  fill: none;
  stroke: #FFFFFF;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 16px;
  stroke-dashoffset: 16px;
  transition: all 0.3s ease;
  transition-delay: 0.1s;
  transform: translate3d(0, 0, 0);
}
.cbx span:first-child:before {
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0,134,191,1);
  display: block;
  transform: scale(0);
  opacity: 1;
  border-radius: 50%;
}
.cbx span:last-child {
  padding-left: 8px;
}
.cbx:hover span:first-child {
  border-color: rgba(0,134,191,1);
}

.inp-cbx:checked + .cbx span:first-child {
  background: rgba(0,134,191,1);
  border-color: rgba(0,134,191,1);
  animation: wave 0.4s ease;
}
.inp-cbx:checked + .cbx span:first-child svg {
  stroke-dashoffset: 0;
}
.inp-cbx:checked + .cbx span:first-child:before {
  transform: scale(3.5);
  opacity: 0;
  transition: all 0.6s ease;
}
@keyframes wave {
  50% {
    transform: scale(0.9);
  }
}
.form-login-usuario .form button {
  font-family: "Roboto", sans-serif;
  text-transform: uppercase;
  outline: 0;
  background: rgba(0,134,191,1);
  width: 100%;
  border: 0;
  margin-bottom: 1em;
  padding: 15px;
  color: #FFFFFF;
  font-size: 14px;
  -webkit-transition: all .7s;
  transition: all .7s;
  cursor: pointer;
}
.form-login-usuario .form button:hover,.form-login-usuario .form button:active,.form-login-usuario .form button:focus {
  background: rgba(0,134,191,.65);
}
.form-login-usuario .form .message {
  align-items: center;
  display: flex;
  justify-content: center;
  color: #b3b3b3;
  font-size: .85em;
  line-height: 1.6em;
}
.form-login-usuario .form .message a {
  color: rgba(255,255,255,1);
  text-decoration: none;
}
.form-login-usuario .form .message a:hover {
  color: rgba(0,134,191,1);
}
.form .register-form {
  display: none;
}
/*.container {
  position: relative;
  z-index: 1;
  max-width: 300px;
  margin: 0 auto;
}*/
.container:before, .container:after {
  content: "";
  display: block;
  clear: both;
}
.container .info {
  margin: 50px auto;
  text-align: center;
}
.container .info h1 {
  margin: 0 0 15px;
  padding: 0;
  font-size: 36px;
  font-weight: 300;
  color: #1a1a1a;
}
.container .info span {
  color: #4d4d4d;
  font-size: 12px;
}
.container .info span a {
  color: #101820;
  text-decoration: none;
}
.container .info span .fa {
  color: #EF3B3A;
}
.no-hay{
  background-color: #fff;
  padding: .5em 0 3em .5em;
  text-align: center;
  max-width: 100%;
  width: 100%;
}
/*FIN Formulario LOGIN USUARIOS*/
/*--header start here--*/
.w3ls-header {
    padding: 0em 0 0;
}
/*.icon1 {
  margin: 0 0 1em;
  padding: .8em 1em;
  background: rgba(255, 255, 255, 0.94);
}*/
.icon1 span.fa {
    color: #222;
    width: 22px;
}
.main-icon {
    text-align: center;
}
.main-icon span.fa{
    font-size: 50px;
    color: #fff;
    margin-bottom: 1em;
}
.wthree li {
    display: inline-block;
}
.bottom {
    margin: 1em 0 0;
}
.header-main {
  align-items: center;
  border-top-color: rgba(0,134,191,1);
  border-top-style: solid;
  border-top-width: 4px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 400px;
  margin: 0 auto;
  position: relative;
  z-index: 999;
  padding: 3em 2em;
  background: rgba(255, 255, 255, 0.04);
  -webkit-box-shadow: -1px 4px 28px 0px rgba(16,24,32,.75);
  -moz-box-shadow: -1px 4px 28px 0px rgba(16,24,32,.75);
  box-shadow: -1px 4px 28px 0px rgba(16,24,32,.75);
}
.regreso-flecha{
  left: 0;
  margin: 1em 0 0 1em;
  position: absolute;
  top: 0;
}
.regreso-flecha i{
  color: rgba(0,134,191,1);
  font-size: 1.5em;
  transition: all .7s;
}
.regreso-flecha i:hover{
  color: rgba(255,255,255,1);
}
.sign-up {
    margin: 2em 0;
}
.header-left {
  background: #fff;
  padding: 0px;
}
.sign-up h2 {
    font-size: 22px;
    color: #fff;
    text-align: center;
    background: #fbbc05;
    width: 40px;
    height: 40px;
    line-height: 1.9em;
    border-radius: 50%;
    margin: 0 auto;
}
/*::-webkit-input-placeholder{
    color: #333!important;
}*/
.form-login-usuario .form input::-webkit-input-placeholder { color:#777; } /* Chrome/Opera/Safari */
.form-login-usuario .form input::-moz-placeholder  { color:#777; }/* Firefox 19+ */
.form-login-usuario .form input:-moz-placeholder   { color:#777; }/* Firefox 18- */
.form-login-usuario .form input:-ms-input-placeholder  { color:#777; } /* IE 10+ */
.form-login-usuario .form input:focus::-webkit-input-placeholder { color:rgba(255,255,255,.3); } /* Chrome/Opera/Safari */
.form-login-usuario .form input:focus::-moz-placeholder  { color:rgba(255,255,255,.3); }/* Firefox 19+ */
.form-login-usuario .form input:focus:-moz-placeholder   { color:rgba(255,255,255,.3); }/* Firefox 18- */
.form-login-usuario .form input:focus:-ms-input-placeholder  { color:rgba(255,255,255,.3); } /* IE 10+ */
.header-left-bottom input[type="email"] {
    outline: none;
    font-size: 15px;
    color: #222;
  border:none;
    width: 90%;
    display: inline-block;
    background: transparent;
    letter-spacing: 1px;
}
.header-left-bottom input[type="password"]{
  outline: none;
  font-size: 15px;
    color: #222;
  border:none;
    width: 90%;
  display: inline-block;
  background: transparent;
    letter-spacing: 1px;
}
.header-left-bottom button.btn {
  background: #007cc0;
  color: #fff;
  font-size: 15px;
  text-transform: uppercase;
  padding: .8em 2em;
  letter-spacing: 1px;
  transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
  display: inline-block;
  cursor: pointer;
  outline: none;
  border: none;
  width: 100%;
}
/*-- agileits --*/
.header-left-bottom p {
    font-size: 17px;
    color: #101820;
    display: inline-block;
    width: 50%;
    margin: 20px 0 0;
    letter-spacing: 1px;
    float: left;
}
.header-left-bottom p.right {
  text-align: right;
}
.header-left-bottom p a {
  font-size: 11px;
  color: #e2e2e2;
  text-transform: uppercase;
}
.social {
    margin: 2em 0 0;
}
.heading h5 {
    color: #c5c5c5;
    color: #101820;
    margin-top: 8px;
    font-size: 20px;
}
.social-usuario span.fa {
  color: #fff;
  font-size: 12px;
  line-height: 35px;
  margin: 0 5px;
  transition: 0.5s all;
}
.social-usuario ul{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 1em;
}
.social-usuario ul li {
    display: inline-block;
    margin: 0 5px;
    font-size: 15px;
    color: #fff;
    letter-spacing: 1px;
    text-transform: capitalize;
}
.social-usuario a.facebook{
    background: rgba(59,89,152,1);
    border-color: transparent;
    border-style: solid;
    border-width: 1px;
    color: #fff;
}
.social-usuario a.facebook:hover{
  background: rgba(16,24,32,.5);
  color: rgba(0,134,191,1);
}
.social-usuario a.twitter{
    background: rgba(29,161,242,1);
    border-color: transparent;
    border-style: solid;
    border-width: 1px;
    color: #fff;
}
.social-usuario a.twitter:hover{
  background: rgba(16,24,32,.5);
  color: rgba(0,134,191,1);
}
.social-usuario a.linkedin {
    background: rgba(0,160,220,1);
    border-color: transparent;
    border-style: solid;
    border-width: 1px;
    color: #fff;
}
.social-usuario a.linkedin:hover{
  background: rgba(16,24,32,.5);
  color: rgba(0,134,191,1);
}
.social-usuario a.google {
    background: rgba(221,75,57,1);
    border-color: transparent;
    border-style: solid;
    border-width: 1px;
    color: #fff;
}
.social-usuario a.google:hover{
  background: rgba(16,24,32,.5);
  color: rgba(0,134,191,1);
}
.social-usuario ul li a {
  background: rgba(255, 255, 255, 0.22);
  width: 35px;
  height: 35px;
  line-height: 35px;
  display: block;
  text-align: center;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.login-check {
    position: relative;
}
.checkbox i {
    position: absolute;
    top: 0px;
    left: 0%;
    text-align: center;
    display: block;
    width: 19px;
    height: 17px;
    outline: none;
    background: #fff;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -o-border-radius: 0px;
    cursor: pointer;
}
.checkbox input:checked + i:after {
    opacity: 1;
}
.checkbox input + i:after {
    position: absolute;
    opacity: 0;
    transition: opacity 0.1s;
    -o-transition: opacity 0.1s;
    -ms-transition: opacity 0.1s;
    -moz-transition: opacity 0.1s;
    -webkit-transition: opacity 0.1s;
}
.checkbox input + i:after {
    content: url(../images/tick.png);
    top: -1px;
    left: 2px;
    width: 15px;
    height: 15px;
}
.checkbox {
    position: relative;
    display: block;
    padding-left: 30px;
    text-transform: capitalize;
    letter-spacing: 1px;
    font-size: 14px;
    color: #fff;
}
input[type="checkbox" i] {
    /*display: none;*/
}
/*-- w3layouts --*/
/*-- header end here --*/

/*-- copyright --*/
.copyright {
    padding: 2em 0;
    text-align: center;
}
.copyright p {
    font-size: 15px;
    letter-spacing: 1px;
    color: #ccc;
    line-height: 1.8em;
}
.copyright p a{
    color: #fff; 
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
  -ms-transition: 0.5s all;
  transition: 0.5s all;
}
/*-- //copyright --*/
/*-- //main --*/
/*-- responsive-design --*/ 
@media(max-width:667px){
  
  .bg-layer h1 {
    font-size: 40px;
    letter-spacing: 3px;
  }
}
@media(max-width:415px){
  
  .bg-layer h1 {
    font-size: 35px;
    letter-spacing: 3px;
  }
  .social-usuario {
    margin: 1em 0 0;
  }
  .copyright {
    padding: 2em 1em;
  }
}
@media(max-width:384px){
  .main-icon span.fa {
    margin-bottom: .6em;
  }
  .header-main {
    max-width: 310px;
    margin: 0 1em;
  }
  .header-left-bottom input[type="email"],.header-left-bottom input[type="password"] {
    width: 88%;
  }
  .social-usuario.social ul li {
    margin: 0 2px;
  }
  .bg-layer h1 {
    font-size: 30px;
  }
} 
/*-- //responsive-design --*/
/*FIN INGRESO USUARIOS Y ESTUDIANTES*/
/*INDICADOR SCROLL--------------------------------------------------------------*/
#ir_arriba_boton{
  align-items: center;
  border-radius: 50%;
  box-shadow: -2px 2px 6px rgba(0, 0, 0, .4);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  height: 50px;
  padding: .15em;
  background-color: rgba(0,200,83,1);
  background-repeat: no-repeat;
  font-size: 28px;
  color: rgba(13,27,42,1);
  cursor: pointer;
  position: fixed;
  bottom: 2.4em;
  left: 10px;
  /* right: 50%; */
  width: 50px;
  z-index: 2;
}
.indicador_contenedor{
  height: 4px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100000000;
}
.indicador_scroll{
  background-color: rgba(0,134,191,1);
  box-shadow: 1px 1px 2px rgba(255, 255, 255, .75);
  height: 100%;
  width: 0;
}
.ocultar{
  opacity: 0;
  visibility: hidden;
  transition: all .7s;
}
.mostrar{
  opacity: 1;
  visibility: visible;
  bottom: -6em;
  /*opacity: 0;*/
  transition: all .7s;
}
/*FIN INDICADOR*/
div.wh-widget-send-button-wrapper{
  bottom: 1em;
}
/*BOTONES SIN BORDES------------------------------------------------------------*/
button:focus{
       outline: none;
}
/*FIN DE LOS BOTONES SIN BORDES*/
/*** ESTILOS BOTÓN SLIDE BOTTOM ----------------------------------------------***/
.ov-btn-slide-bottom {
  background: #fff; /* color de fondo */
  color: #0086bf; /* color de fuente */
  border: 2px solid #0086bf; /* tamaño y color de borde */
  padding: 16px 20px;
  border-radius: 3px; /* redondear bordes */
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: inline-block;
}
.ov-btn-slide-bottom:hover {
  color: #fff; /* color de fuente hover */
}
.ov-btn-slide-bottom::after {
  content: "";
  background: #0086bf; /* color de fondo hover */
  position: absolute;
  z-index: -1;
  padding: 16px 20px;
  display: block;
  left: 0;
  right: 0;
  top: 100%;
  bottom: -100%;
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
}
.ov-btn-slide-bottom:hover::after {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
}
/*FIN BOTÓN SLIDE BOTTOM*/
/*INCLINACIONES---------------------------------------------------------------------------------------------------*/
.inclinar-contadores-arriba,.inclinar-valores-arriba,.inclinar-beneficios-arriba{
  border-width: 10vh 100vw 0 0;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
  left: 0;
  position: absolute;
  top: 0;
  z-index: 2;
}
.inclinar-contadores-abajo{
  border-width: 0 0 10vh 100vw;
  border-style: solid;
  border-color: transparent transparent #e5e5e5 transparent;
  left: 0;
  position: absolute;
  bottom: 0;
  z-index: 2;
}
.inclinar-portada-abajo,.inclinar-abajo-contacto,.inclinar-abajo-eventos,.inclinar-abajo-servicios{
  border-width: 0 0 10vh 100vw;
  border-style: solid;
  border-color: transparent transparent #f5f5f5 transparent;
  left: 0;
  position: absolute;
  bottom: 0;
  z-index: 3;
}
.inclina-oscuro{
  border-color: transparent transparent #0d1b2a transparent;
}
.inclinar-abajo-contacto{
  border-color: transparent transparent #e5e5e5 transparent;
}
.inclinar-abajo-servicios{
  border-color: transparent transparent #ddd transparent;
}
.inclinar-nosotros-abajo{
  border-width: 0 0 10vh 100vw;
  border-style: solid;
  border-color: transparent transparent #101820 transparent;
  left: 0;
  position: absolute;
  bottom: 0;
  /*z-index: 4;*/
}
.inclinar-portada-abajo-b,.inclinar-abajo-blog,.inclinar-portada-abajo-bb,.inclinar-empresa-abajo{
  border-width: 0 100vw 10vh 0;
  border-style: solid;
  border-color: transparent transparent #FFF transparent;
  left: 0;
  position: absolute;
  bottom: 0;
  z-index: 3;
}
.inclinar-portada-abajo-bb{
  border-color: transparent transparent #101820 transparent;
}
.inclinar-abajo-blog{
  border-color: transparent transparent #fff transparent;
}
.inclinar-abajo-eventos{
  border-color: transparent transparent #fff transparent;
}
.inclinar-empresa-abajo{
  border-color: transparent transparent #FFF transparent;
}
.inclinar-valores-arriba{
  border-color: #fff transparent transparent transparent;
}
.inclinar-beneficios-arriba{
  border-color: #ddd transparent transparent transparent;
}
/*FIN INCLINACIONES*/
/*DEFINIENDO COLORES----------------------------------------------------------------------------------------------*/
.bg-azul{
  background-color: #007bff;
}
.bg-blanco{
  background-color: #fff;
}
.bg-gris{
  background-color: #63666A;
}
.bg-negro{
  background-color: #101820;
}
.bg-verde{
  background-color: #00c853;
}
.bg-verde-claro{
  background-color: #24a319;
}
.bg-rojo{
  background-color: red;
}
.txt-azul{
  color: #007bff;
}
.txt-blanco{
  color: #fff;
}
.txt-gris{
  color: #63666A;
}
.txt-gris-claro{
  color: #b9b9b9;
}
.txt-negro{
  color: #101820;
}
.txt-rojo{
  color: red;
}
.txt-rojo-claro{
  color: #ff5232;
}
.txt-verde{
  color: #00c853;
}
.txt-verde-claro{
  color: #24a319;
}
.txt-htmlfive{
  color: rgba(236,98,49,1);
}
.txt-psd{
  color: rgba(60,50,123,1);
}
.txt-psdb{
  color: rgba(132,195,252,1);
}
.txt-cdr{
  color: rgba(57,255,20,1);
}
.txt-ai{
  color: #efb810;
}
/*FIN DEFINICIÓN DE COLORES*/
/*FORMATOS DE TEXTO------------------------------------------------------------------------*/
.negrita{
  font-weight: bold;
}
.subrayado{
  text-decoration: underline;
}
.cursiva{
  font-style: italic;
}
.negrita-subrayado{
  font-weight: bold;
  text-decoration: underline;
}
.negrita-cursiva{
  font-weight: bold;
  font-style: italic;
}
.subrayado-cursiva{
  text-decoration: underline;
  font-style: italic;
}
.negrita-subrayado-cursiva{
  font-weight: bold;
  text-decoration: underline;
  font-style: italic;
}
.mayuscula{
  text-transform: uppercase;
}
/*FIN FORMATOS DE TEXTO*/
.linea-gris{
  border-color: #c5c5c5;
  border-style: dashed;
  border-width: 1px;
  margin: 1em 0;
}
/*PÁGINAS DE ERROR--------------------------------------------------------------------------*/
.error-404{
  background-attachment: fixed;
  background-color: #101820;
  background-image: url(../images/desierto.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.error-403{
  background-color: rgba(0,134,191,1);
}
#contenedor-404,#contenedor-403{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  height: 100vh;
  width: 100%;
}
.oscurece-error{
  background-color: rgba(16,24,32,.5);
  height: 100vh;
  position: absolute;
  width: 100%;
  z-index: 1;
}
.contiene-404{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 800px;
  margin: auto;
  width: 90%;
  z-index: 2;
}
.header-error404{
  color: rgba(255,255,255,1);
  margin-bottom: 1em;
}
.linea-error{
  border-color: rgba(255,255,255,.7);
  border-style: dashed;
  border-width: 2px;
  width: 100%;
}
.linea-errorb{
  margin-bottom: 1em;
}
.error404-h{
  color: rgba(255,255,255,1);
  font-size: 4em;
  margin: 0;
  text-align: center;
  text-shadow: 1px 1px 10px rgba(16,24,32,.5);
}
.semi-error{
  color: rgba(255,255,255,.6);
  text-shadow: none;
}
.error404-p{
  background-color: rgba(0,134,191,1);
  color: rgba(255,255,255,1);
  padding: .25em .5em;
}
.negro404{
  background-color: rgba(16,24,32,.5);
  text-align: center;
}
.error404-p2{
  color: rgba(255,255,255,1);
  text-align: center;
  text-shadow: 1px 1px 10px rgba(16,24,32,.5);
  width: 100%;
}
.footer-error404{
  color: rgba(255,255,255,1);
  font-size: .9em;
  margin-top: 1em;
  text-align: center;
  width: 100%;
}
/*FIN PÁGINAS DE ERROR----------------------------------------------------------------------*/
/*COOKIES*/
.aviso-cookies {
  display: none;
  background: #fff;
  padding: 20px;
  width: calc(100% - 40px);
  max-width: 300px;
  line-height: 150%;
  border-radius: 10px;
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1102;
  padding-top: 60px;
  box-shadow: 0px 2px 20px 10px rgba(222,222,222,.25);
  text-align: center;
}
.aviso-cookies.activo {
  display: block;
}
.aviso-cookies .galleta {
  max-width: 100px;
  position: absolute;
  top: -50px;
  left: calc(50% - 50px);
}
.aviso-cookies .parrafo {
  font-size: .9em;
  margin-bottom: 15px;
}
#aviso-cookies h3.titulo{
  background-color: transparent;
  color: #101820;
  padding: 0;
}
.aviso-cookies .boton {
  width: 100%;
  background: rgba(0,134,191,1);
  border: none;
  color: #fff;
  font-family: 'Roboto', sans-serif;
  text-align: center;
  padding: 15px 20px;
  font-weight: 700;
  cursor: pointer;
  transition: .3s ease all;
  border-radius: 5px;
  margin-bottom: 15px;
  font-size: 14px;
}
.aviso-cookies .boton:hover {
  background: #101820;
}
.aviso-cookies .enlace {
  color: #101820;
  text-decoration: none;
  font-size: 14px;
  font-weight: bold;
}
.aviso-cookies .enlace:hover {
  text-decoration: underline;
}
.fondo-aviso-cookies {
  display: none;
  background: rgba(16,24,32,.5);
  position: fixed;
  z-index: 1101;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
}
.fondo-aviso-cookies.activo {
  display: block;
}
/*FIN COOKIES-------------------------------------------------------------------------------*/
.avatar-nombre{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}
.avatar{
  background-color: #0086bf;
  /*border-color: rgba(255, 255, 255, 1);*/
  border-radius: 50%;
  /*border-style: solid;
  border-width: 2px;*/
  max-width: 35px;
  margin-right: .5em;
}
.avatar-nombre p{
  color: rgba(255,255,255,.65);
  font-size: .9em;
  padding-right: 0.7em;
}
/*PAGINACION PRODUCTOS.....................................................................*/
.prev-next{
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}
.paginacion-btn{
  background-color: transparent;
  border-color: #0086bf;
  border-radius: .5em 0 .5em 0;
  border-style: solid;
  border-width: 1px;
  color: #0086bf;
  margin: .1em;
  padding: 0.5em 1em;
}
.paginacion-btn:hover{
  background-color: #0086bf;
  color: #fff;
}
/*CONTRUYENDO..............................................................................*/
.contiene-construyendo{
  background-color: #fff;
}
.n-txt-negro{
  color: #101820;
  text-shadow: none;
}
/*FIN CONSTRUYENDO--------------------------------------------------------------------------*/
h2.swal2-title{
  color: #101820;
}
/*RESPONSIVE*/
@media (max-width: 1300px) {
  #whatsapp{
    font-size: .9em;
  }
  .pre-menupc ul li a{
    font-size: .9em;
  }
  .post-menupc ul li a{
    padding: 0 .7em;
  }
}
@media (max-width: 1260px) {
  .contenedor-nosotros{
    grid-template-areas: 
      "perfil perfil"
      "manualc alianza";
    grid-template-columns: repeat(2, 1fr);
  }
  .perfil h2,.perfil p{
    text-align: center;
  }
  .pre-footer{
    grid-template-areas:
      "contactodatos empresa servicios"
      "suscripcion suscripcion suscripcion";
    /*grid-template-columns: repeat(3, 1fr);*/
  }
  .widget_blog_subscription form,.noticia-titulo,.noticia-recibe{
    margin: auto;
    max-width: 800px;
    width: 100%;
  }
  .noticia-titulo,.noticia-recibe{
    margin: 1rem auto;
  }
  .mas-ancho{
    text-align: center;
    width: 100%;
  }
  .centrar-capcha{
    margin: auto;
  }
  .cotizar-checkbox-item{
    margin: .2em auto;
  }
  footer#footer-principal{
    position: relative;
  }
  #footer-invisible{
    display: none;
  }
  .metodos-footer{
    max-width: 250px;
    width: 100%;
  }
  .noticias-blog,.blog-container{
    width: 65%;
  }
  .noticias-cat{
    width: 30%;
  }
  .noticias-blog .container-blog{
    max-width: 550px;
    width: 100%;
  }
  .portada-txt{
    margin-top: -90px;
  }
  .portada-txt-legal{
    margin-top: -47px;
  }
}
@media(max-width: 800px) {
  header#header-principal{
    display: none;
  }
  header#header-principal-b{
    background-color: #0d1b2a;
    display: flex;
    flex-wrap: wrap;
    /*padding: 0 0 .8em 0;*/
  }
  .btn-menu{
    color: #101820;
  }
  .author{
    font-size: .83em;
  }
  .clientes-mini{
    grid-template-columns: repeat(3, 1fr);
  }
  .contiene-serv{
    grid-template-areas: 
      "titulomas titulomas titulomas"
      "subtitulomas subtitulomas subtitulomas"
      "videohome videohome aplicacioneshome"
      "mobilehome disenohome disenohome"
      "webhome psdhome marketinghome"
      "webhome multimediahome multimediahome"
      "notaahome notaahome notaahome"
      "notabhome notabhome notabhome";
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: max-content max-content repeat(4, 1fr) max-content max-content;
  }
  .contiene-trabajamos{
    grid-template-areas:
      "publico-txt briefing-txt presupuesto-txt"
      "contacto-txt anticipo-txt boceto-txt"
      "desarrollo-txt informe-txt entrega-txt"
      ". saldo-txt .";
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(4, 1fr);
  }
  .cbx span:last-child{
    font-size: .85em;
  }
  .contiene-marketing {
    /* align-items: flex-start; */
    align-self: start;
    display: grid;
    grid-gap: 2em;
    grid-template-areas:
        "marketing-txta marketing-txta marketing-txta"
        "marketing-img marketing-img marketing-img"
        "marketing-txtb marketing-txtb marketing-txtb"
        "marketing-title marketing-title marketing-title"
        "marketing-contenidos video-marketing e-marketing"
        "redes-sociales posicionamiento-seo analitica-web"
        "publicidad-online consultoria relacionamiento";
    grid-template-rows: repeat(3, max-content), repeat(3, 1fr);
  }
  .marketing-txta,.marketing-img,.marketing-txtb{
    margin: auto;
    max-width: 800px;
  }
  .actual-txt,.nuevo-txt{
    margin: 0 auto 3em auto;
    max-width: 800px;
    width: 100%;
  }
  .soporte-list li:before{
    left: 2.5em;
  }
  .carrusel-relacionados{
    display: none;
  }
  .carrusel-relacionadosb{
    display: flex;
  }
  a.presupuestar-btn{
    font-size: .8em;
  }
  .noticias-home .container-blog{
    width: 45%;
  }
  .mm .iconos-desplegabler{
    justify-content: flex-start;
  }
}
@media(max-width:  1090px){
  .nosotros-home-img,.nosotros-home-txt,.eventos-txt,.eventos-img{
    width: 100%;
  }
  .titulo-pymes{
    text-align: left;
  }
  .nosotros-home-img{
    margin-bottom: 1em;
    max-width: 800px;
  }
  .eventos-txt{
    margin-bottom: 3em;
  }
  .nosotros-home-img,.nosotros-home-txt{
    width: 100%;
  }
}
@media(max-width: 1050px){
  .contiene-disenos{
    grid-template-areas:
        "diseno-grafico-img diseno-grafico-txt diseno-grafico-txt diseno-grafico-ali"
        "diseno-grafico-title diseno-grafico-title diseno-grafico-title diseno-grafico-title"
        "imagen-identidad imagen-identidad diseno-publicitario diseno-publicitario"
        "diseno-editorial diseno-editorial gran-formato gran-formato"
        "souvenirs souvenirs packaging packaging"
        "fotografia fotografia ilustracion ilustracion";
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: max-content max-content repeat(4, 1fr);
  }
  .productos-nuevos .tarjeta-producto{
    width: 45%;
  }
  .productos-home .tarjeta-producto{
    width: 25%;
  }
  .relacionados .tarjeta-producto{
    width: 100%;
  }
  .container-blog{
    width: 100%;
  }
  .logistica-evento, .landing-evento, .promocion-evento{
    margin: auto;
    max-width: 700px;
    text-align: center;
    width: 100%;
  }
  .logistica-evento, .landing-evento{
    margin-bottom: 3em;
  }
  .portada-titulo{
    font-size: 2em;
  }
}
@media (max-width: 1024px) {
  #whatsapp{
    width: 100%;
  }
  .whatsapp-txt,#whatsapp a,#whatsapp a:last-child{
    padding: .5em;
  }
  header.titulo-nota{
    align-items: center;
    display: flex;
    justify-content: center;
  }
  .contiene-cotizar{
    grid-gap: 3em;
  }
  .menupb-logob-carritob{
    grid-gap: 1em;
  }
  .col-cuadruple{
    width: 46%;
  }
  .soporte-list li{
    padding-left: 2.5em;
    padding-right: 0;
  }
  form .search-btn{
    color: #101820;
    margin-left: 0;
  }
  .relacionados .tarjeta-producto{
    width: 100%;
  }
  .portada-txt-home{
    margin-top: -10%;
  }
  .contiene-multimedia{
    grid-template-areas:
        "multimedia-txt multimedia-txt"
        "multimedia-vdo multimedia-vdo"
        "multimedia-title multimedia-title"
        "multi-educativa multi-publicitaria"
        "multi-comercial multi-informativa";
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: max-content max-content max-content repeat(2, 1fr);
  }
  .soporte-list li:before{
    left: 2em;
  }
  /*------------------------------------------------*/
  .diseno-web-txt,.diseno-web-img{
    width: 100%;
  }
  .diseno-web-img{
    text-align: center;
  }
  #result{
    padding-top: 0;
  }
  .pago-btn{
    margin-top: 1em;
    width: 100%;
  }
  .contar-carrito{
    top: 0;
  }
  .pre-footer {
    grid-template-areas:
      "suscripcion"
      "contactodatos";
    grid-template-columns: 1fr;
  }
  .visible-invisible{
    display: flex;
    margin: 1em auto 0 auto;
  }
  .empresa,.servicios{
    display: none;
  }
  .contacto-datos{
    text-align: center;
  }
  footer#footer-principal h3{
    text-align: center;
  }
  .contenedor-socios h2, .contenedor-agenda h2{
    font-size: 2em;
  }
  .empresa-txt, .empresa-img{
    width: 100%;
  }
}
@media (max-width: 992px) {
  .wrap-contact100 {
    /*padding: 82px 80px 33px 80px;*/
  }
  .alert-validate::before {
    visibility: visible;
    opacity: 1;
  }
  .redes-icon{
    margin-left: auto;
    margin-right: auto;
  }
  .aviso-aside{
    grid-template-areas: 
      "aviso"
      "aside-legal";
    grid-template-columns: 1fr;
  }
  .aviso-img{
    text-align: center;
  }
  .contiene-cotizar{
    grid-template-areas: 
      "cotizar-txt cotizar-txt"
      "cotizar-form-a cotizar-form-b"
      "cotizar-form-c cotizar-form-d";
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 2.5em;
  }
  .author{
    font-size: 1em;
  }
  .form-group label.flexible-label{
    display: flex;
  }
  /*---------------------------------------------------------------------------*/
  
  .titulo .fa {
    font-size: 40px;
    margin-bottom: 5px;
  }
  .precio {
    padding: 4px 0;
  }
  .precio h3 {
    font-size: 20px;
  }
  .enlace a {
    margin: 20px 0;
    padding: 8px 20px;
    font-size: 18px;
  }
  .enlace a:hover {
    transform: scale(1.05);
  }
  .tabla:hover {
    transform: none;
  }
}
@media(max-width: 970px){
  .contenedor-contadores{
    grid-template-areas:
      "clienteshome proyectoshome gustahome"
      "soportehome trayectoriahome garantiahome";
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, max-content);
  }
  .contando:nth-child(1),.contando:nth-child(2),.contando:nth-child(3){
    margin-bottom: 3em;
  }
}
@media(max-width: 940px){
  .contiene-disenos{
    grid-template-areas:
        "diseno-grafico-img diseno-grafico-img"
        "diseno-grafico-txt diseno-grafico-ali"
        "diseno-grafico-title diseno-grafico-title"
        "imagen-identidad diseno-publicitario"
        "diseno-editorial gran-formato"
        "souvenirs packaging"
        "fotografia ilustracion";
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr max-content max-content repeat(4, 1fr);
  }
  .contiene-marketing {
    /* align-items: flex-start; */
    align-self: start;
    display: grid;
    grid-gap: 2em;
    grid-template-areas:
        "marketing-txta"
        "marketing-img"
        "marketing-txtb"
        "marketing-title"
        "marketing-contenidos"
        "video-marketing"
        "e-marketing"
        "redes-sociales"
        "posicionamiento-seo"
        "analitica-web"
        "publicidad-online"
        "consultoria"
        "relacionamiento";
    grid-template-columns: 1fr;
    grid-template-rows: repeat(13, max-content);
    max-width: 600px;
  }
  .psd-html-img,.psd-html-txt{
    width: 100%;
  }
  .psd-html-img{
    margin-bottom: 2em;
  }
  .mi-servicio{
    width: 45%;
  }
}
@media(max-width: 880px){
  .btn-menu{
    color: #101820;
  }
  /*BUSCADOR-------------------------------------------------------------------------------*/
  form .search-box{
    right: 0;
  }
  form .search-box:hover > .search-txt{
    background-color: #fff;
    border-color: #222;
    border-style: dashed;
    border-width: 1px;
    font-weight: normal;
  }
  form .search-box:hover > .search-btn{
    background-color: transparent;
  }
  #extra-ico ul li a, #extra-icob ul li a{
    color: #101820;
  }
  .noticias-home .container-blog{
    max-width: 550px;
    width: 100%;
  }
  .noticias-list{
    justify-content: center;
  }
/*FIN BUSCADOR---------------------------------------------------------------------------*/
  .clientes-mini{
    grid-template-columns: repeat(2, 1fr);
  }
  .col-triple{
    width: 100%;
  }
  .empleo-btns{
    grid-template-areas:
      "lk-btn"
      "fb-btn";
    grid-template-columns: 1fr;
    grid-template-rows: 2fr;
  }
  .empleo-campos{
    grid-template-areas:
      "empleo-ca empleo-cb"
      "empleo-cc empleo-cd"
      "empleo-ce empleo-cf"
      "empleo-politica empleo-politica"
      "adjunta-cv adjunta-cv"
      "curriculum-btn curriculum-btn";
  }
  .metodo-payu,.metodo-consignaciones,.metodo-efectivo{
   grid-template-areas:
      "payu-img"
      "payu-txt";
    grid-template-columns: 1fr;
    grid-template-rows: .75fr 1fr;
  }
  .metodo-consignaciones{
    grid-template-areas: 
      "consignaciones-img"
      "consignaciones-txt";
  }
  .metodo-efectivo{
    grid-template-areas: 
      "efectivo-img"
      "efectivo-txt";
  }
  .metodo-parte-c{
    max-width: 500px;
  }
  .metodo-parte-a{
    background-color: #0086bf;
  }
  #contenedor-metodos h2{
    margin-bottom: 0;
  }
  .consignaciones-img .metodo-parte-b{
    background-color: #0086bf;
  }
  .productos-nuevos{
    width: 60%;
  }
  .categorias-lateral{
    width: 35%;
  }
  .productos-nuevos .tarjeta-producto{
    width: 41%;
  }
  .productos-home{
    width: 100%;
  }
  .productos-home .tarjeta-producto{
    width: 28%;
  }
  .relacionados{
    width: 100%;
  }
  .relacionados .tarjeta-producto{
    width: 100%;
  }
  .padding-arriba{
    padding: 1em 0;
  }
  .blog-container{
    margin: 2em auto 3em auto;
  }
  .noticias-blog,.noticias-cat,.blog-container{
    width: 100%;
  }
  .categorias-repeat{
    width: auto;
  }
  #servicios-home h2{
    font-size: 2em;
  }
}
@media(max-width: 830px){
  .contacto-datos{
    text-align: center;
  }
  .contenedor-otros-servicios{
    grid-template-areas:
      "cursos-otros diseno-otros"
      "web-otros mobile-otros"
      "hosting-otros psd-otros"
      "marketing-otros multimedia-otros";
    grid-template-columns: repeat(2, 1fr);
  }
  .contactoform-contactomap{
    grid-gap: 0;
    grid-template-areas: 
      "contacto-form"
      "contacto-map";
    grid-template-columns: 1fr;
  }
  .contacto-map{
    display: none;
  }
  .helper-text{
    text-align: center;
  }
  .pago-precio{
    text-align: right;
    width: 80%;
  }
  .pago-referencia{
    text-align: left;
    width: 70%;
  }
  .pago-btn{
    margin-top: 0;
    text-align: right;
    width: 25%;
  }
  .pago-reflejado,.pago-referencia{
    width: 100%;
  }
  .relacionados .tarjeta-producto{
    width: 100%;
  }
  .carrusel-relacionadosb{
    display: none;
  }
  .carrusel-relacionadosc{
    display: flex;
  }
  .productos-nuevos{
    width: 90%;
  }
  .categorias-lateral{
    max-width: 500px;
    width: 100%;
  }
  .productos-nuevos .tarjeta-producto{
    width: 28%;
  }
  .relacionados .tarjeta-producto{
    width: 100%;
  }
  #equipo{
    grid-template-areas:
      "tituloequipo tituloequipo"
      "integrantea integranteb"
      "integrantec integranted"
      "integrantee integrantef"
      "integranteg integranteh";
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: max-content repeat(3, 1fr);
  }
}
@media(max-width: 800px){
  .contiene-serv{
    grid-template-areas: 
      "titulomas titulomas"
      "subtitulomas subtitulomas"
      "videohome videohome"
      "aplicacioneshome disenohome"
      "webhome mobilehome"
      "webhome marketinghome"
      "multimediahome psdhome"
      "notaahome notaahome"
      "notabhome notabhome";
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: max-content max-content repeat(5, 1fr) max-content max-content;
  }
  .empleoredes-empleoform {
    grid-template-areas:
      "empleo-izq"
      "empleo-der"
      "empleo-repolitica";
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, max-content);
  }
  .empleo-btns {
    grid-template-areas:
      "lk-btn fb-btn";
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
  }
  main#blog, aside#blog-der{
    margin: auto;
    width: 100%;
  }
  .sitio-basico-txt,.sitio-corporativo-txt,.e-commerce-txt,.e-learning-txt,.portal-inmobiliario-txt,
  .portal-noticias-txt,.portal-reservas-txt,.bolsa-empleo-txt,.landing-txt,.entretenimiento-txt,
  .cms-txt,.mantenimiento-txt,.actual-txt,.nuevo-txt{
    margin: auto;
    max-width: 600px;
    width: 100%;
  }
  .productos-nuevos .tarjeta-producto{
    max-width: 280px;
    width: 45%;
  }
  .carrusel-relacionadosc .tarjeta-producto{
    width: 100%;
  }
  .carrito-izq,.carrito-der{
    width: 100%;
  }
  .carrito-der h2{
    margin-top: 2em;
  }
  .noticias-blog,.noticias-cat{
    max-width: 550px;
    width: 100%;
  }
  .categorias-repeat{
    width: 47%;
  }
  .actual-txt, .nuevo-txt{
    margin-bottom: 3em;
  }
  .html-txt, .css-txt, .js-txt{
    width: 100%;
  }
  .html-txt, .css-txt{
    margin-bottom: 3em;
  }
  .mision,.vision,.los-valores,.la-metodologia{
    width: 100%;
  }
  .los-valores{
    margin-bottom: 4em;
  }
}
@media (max-width: 768px) {
  .rs1-wrap-input100 {
    width: 100%;
  }
  .col-cuadruple,.col-doble{
    margin-bottom: .5em;
    width: 100%;
  }
  .col-triple{
    margin-bottom: .5em;
  }
  .contiene-trabajamos{
    grid-template-areas:
      "publico-txt briefing-txt"
      "presupuesto-txt contacto-txt"
      "anticipo-txt boceto-txt"
      "desarrollo-txt informe-txt"
      "entrega-txt saldo-txt";
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(5, 1fr);
  }
  .contiene-formas{
    grid-template-areas:
      "punico-txt"
      "pmitimiti-txt"
      "pmensual-txt";
    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, 1fr);
    max-width: 550px;
  }
  .contenedor-nosotros {
    grid-template-areas: 
      "perfil"
      "manualc"
      "alianza";
    grid-template-columns: 1fr;
  }
  .alianza h2,.manualc h2{
    text-align: center;
  }
}
@media screen and (max-width: 750px){
  .pricing-table{
    width: 72%;
    margin-bottom: 20px;
  }
  .pricing-wrap{
    justify-content: center;
  }
  .pricing-table:hover{
    transform: scale(1.0) ;
  }
  .pagos-img, .pagos-txt{
    width: 100%;
  }
  .pagos-img{
    margin-bottom: 2em;
  }
  .usuario-cliente{
    grid-template-areas: 
      "usuario"
      "cliente";
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, 1fr);
  }
  .soporte-list li:before{
    left: 1.4em;
  }
  .tres-form {
    width: 45%;
  }
  .contiene-disenos{
    grid-template-areas:
        "diseno-grafico-img diseno-grafico-img"
        "diseno-grafico-txt diseno-grafico-txt"
        "diseno-grafico-ali diseno-grafico-ali"
        "diseno-grafico-title diseno-grafico-title"
        "imagen-identidad diseno-publicitario"
        "diseno-editorial gran-formato"
        "souvenirs packaging"
        "fotografia ilustracion";
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr max-content max-content max-content repeat(4, 1fr);
  }
  .diseno-grafico-ali{
    text-align: center;
  }
  .responsive-img,.responsive-txt{
    width: 100%;
  }
  .pago-referencia,.pago-btn{
    text-align: center;
    width: 100%;
  }
  .pago-btn{
    margin-top: 1em;
  }
  .pago-reflejado,.pago-referencia{
    text-align: left;
  }
}
@media(max-width: 680px){
  .contiene-multimedia{
    grid-template-areas:
        "multimedia-txt"
        "multimedia-vdo"
        "multimedia-title"
        "multi-educativa"
        "multi-publicitaria"
        "multi-comercial"
        "multi-informativa";
    grid-template-columns: 1fr;
    grid-template-rows: repeat(7, max-content);
  }
  .contiene-multimedia section,.contiene-multimedia article{
    margin-bottom: 3em;
  }
  .lista-pagos h1{
    font-size: 2em;
  }
  .portada-txt-home{
    margin-top: -10%;
  }
  .salto-linea{
    display: none;
  }
  .mi-servicio{
    width: 100%;
  }
}
@media (min-width: 640px) {
  .blog-card {
    flex-direction: row;
  }
  .blog-card .meta {
    flex-basis: 40%;
    height: auto;
  }
  .blog-card .description {
    flex-basis: 60%;
  }
  .blog-card .description:before {
    transform: skewX(-3deg);
    content: "";
    background: #fff;
    width: 30px;
    position: absolute;
    left: -10px;
    top: 0;
    bottom: 0;
    z-index: -1;
  }
  .blog-card.alt {
    flex-direction: row-reverse;
  }
  .blog-card.alt .description:before {
    left: inherit;
    right: -10px;
    transform: skew(3deg);
  }
  .blog-card.alt .details {
    padding-left: 25px;
  }
}
@media (max-width: 600px){
  .portada-titulo{
    font-size: 2.2em;
  }
  div.txt-one, div.txt-two{
    font-size: 1em;
  }
  div.txt-two span {
    margin-left:-360px;
  }
  @keyframes showup {
      0% {opacity:0;}
      20% {opacity:1;}
      80% {opacity:1;}
      100% {opacity:0;}
  }
  @keyframes slidein {
      0% { margin-left:-800px; }
      20% { margin-left:-800px; }
      35% { margin-left:0px; }
      100% { margin-left:0px; }
  }
  @keyframes reveal {
      0% {opacity:0;width:0px;}
      20% {opacity:1;width:0px;}
      30% {width:360px;}
      80% {opacity:1;}
      100% {opacity:0;width:360px;}
  }
  footer.nota-iconos{
    margin-top: 1em;
  }
  .pos-footer div{
    margin-bottom: .5em;
    text-align: center;
    width: 50%;
  }
  .linea-ver-footer{
    display: none;
  }
  .clientes-mini{
    grid-template-columns: 1fr;
    max-width: 330px;
  }
  .dos-form,.tres-form {
    margin-bottom: 1em;
    width: 100%;
  }
  .metodo-payu,.metodo-consignaciones,.metodo-efectivo{
    grid-template-rows: .5fr 1fr;
  }
  .carrusel-relacionadosc{
    display: none;
  }
  .carrusel-relacionadosd{
    display: flex;
    margin: auto;
    width: 95%;
  }
  .alinear-capcha{
    margin: 0;
  }
  .productos-nuevos .tarjeta-producto{
    width: 40%;
  }
  .relacionados{
    justify-content: center;
  }
  .relacionados .tarjeta-producto{
    width: 100%;
  }
  .nosotros-home-txt h2,.productos-nuevos h2,#equipo h2,#contenedor-formas h2,
  #contenedor-metodos h2, #contenedor-preguntas h2,.eventos-txt h2,.diseno-grafico-title h2,
  .complemento-evento h2,.titulo-ux-ui,.titulo-delo-ux,.titulo-psd{
    font-size: 2.4em;
  }
  .actual-txt, .nuevo-txt{
    padding: 1em;
  }
  #servicios-home h2{
    font-size: 1.8em;
  }
  .portada-txt{
    margin-top: -160px;
  }
  .portada-txt-legal{
    margin-top: -47px;
  }
  .portada-txt-home{
    margin-top: -10%;
  }
  .portada-txt-contacto{
    margin-top: -30%;
  }
}
@media (max-width: 576px) {
  .wrap-contact100 {
    /*padding: 82px 15px 33px 15px;*/
  }
  .contiene-serv{
    grid-template-areas: 
      "titulomas"
      "subtitulomas"
      "videohome"
      "webhome"
      "webhome"
      "aplicacioneshome"
      "mobilehome"
      "psdhome"
      "marketinghome"
      "disenohome"
      "multimediahome"
      "notaahome"
      "notabhome";
    grid-template-columns: 1fr;
    grid-template-rows: max-content max-content max-content max-content repeat(7, 1fr) max-content max-content;
  }
  header.perfil-form{
    grid-template-areas:
      "perfilimg perfilnombre"
      "perfildatos perfildatos";
    grid-template-columns: max-content 1fr;
    grid-template-rows: repeat(2, max-content);
  }
  .author{
    font-size: .9em;
  }
  .contiene-disenos {
    grid-template-areas:
        "diseno-grafico-img"
        "diseno-grafico-txt"
        "diseno-grafico-ali"
        "diseno-grafico-title"
        "imagen-identidad"
        "diseno-publicitario"
        "diseno-editorial"
        "gran-formato"
        "souvenirs"
        "packaging"
        "fotografia"
        "ilustracion";
    grid-template-columns: 1fr;
    grid-template-rows: 1fr max-content max-content max-content repeat(8, 1fr);
  }
  .servicio-btn-home{
    max-width: 400px;
    width: 100%;
  }
  .portada-txt-home{
    margin-top: -20%;
  }
  #servicios-home h2{
    font-size:1.7em;
  }
  #ir_arriba_boton{
    bottom: 1.5em;
  }
}
@media screen and (max-width: 500px){
  .pricing-table{
    width: 90%;
  }
  .cuerpo-nota{
    grid-template-areas:
      "notaimg"
      "notatxt";
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, max-content);
  }
  .soporte-list li:before{
    left: .5em;
  }
  .contiene-trabajamos{
    grid-template-areas:
      "publico-txt"
      "briefing-txt"
      "presupuesto-txt"
      "contacto-txt"
      "anticipo-txt"
      "boceto-txt"
      "desarrollo-txt"
      "informe-txt"
      "entrega-txt"
      "saldo-txt";
    grid-template-columns: 1fr;
    grid-template-rows: repeat(10, 1fr);
  }
  .productos-nuevos .tarjeta-producto{
    margin: 0 auto 2.5em auto;
    max-width: 260px;
    width: 100%;
  }
  .metodo-payu,.metodo-consignaciones,.metodo-efectivo{
    text-align: left;
  }
  .portada-txt{
    margin-top: -200px;
  }
  .portada-txt-legal{
    margin-top: -90px;
  }
  .portada-txt-home{
    margin-top: -40%;
  }
  .portada-txt-contacto{
    margin-top: -40%;
  }
}
@media(max-width: 480px){
  footer.nota-iconos{
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .micono{
    margin-top: .5em;
    width: 40%;
  }
  .micono:nth-child(2),.micono:nth-child(4){
    justify-content: flex-end;
  }
  .contact100-form-title{
    font-size: 1.5em;
  }
  .contiene-cotizar{
    grid-template-areas: 
      "cotizar-txt"
      "cotizar-form-a"
      "cotizar-form-b"
      "cotizar-form-c"
      "cotizar-form-d";
    grid-template-columns: 1fr;
    grid-gap: 2.5em;
  }
  .author{
    font-size: 1em;
  }
  .contenedor-otros-servicios{
    grid-template-areas:
      "cursos-otros"
      "diseno-otros"
      "web-otros"
      "mobile-otros"
      "hosting-otros"
      "psd-otros"
      "marketing-otros"
      "multimedia-otros";
    grid-template-columns: 1fr;
  }
  .contenedor-contadores{
    grid-template-areas:
      "clienteshome proyectoshome"
      "gustahome soportehome"
      "trayectoriahome garantiahome";
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, max-content);
  }
  .contando:nth-child(4){
    margin-bottom: 3em;
  }
  .doble-campo{
    width: 100%;
  }
  #equipo{
    grid-gap: .75em;
  }
  .categorias-repeat{
    width: 100%;
  }
  .portada-txt{
    margin-top: -230px;
  }
  .portada-txt-legal{
    margin-top: -90px;
  }
  .portada-txt-home{
    margin-top: -50%;
  }
  .portada-txt-contacto{
    margin-top: -50%;
  }
  .portada-txt-clientes{
    margin-top: -40%;
  }
}
@media(min-width: 480px){
  .headroom{
    transition: transform .6s ease;
  }
  .headroom--pinned{
    transform: translateY(0%);
  }
  .headroom--unpinned{
    transform: translateY(-100%);
  }
}
@media(max-width: 400px){
  #equipo{
    grid-template-areas:
      "tituloequipo"
      "integrantea"
      "integranteb"
      "integrantec"
      "integranted"
      "integrantee"
      "integrantef"
      "integranteg"
      "integranteh";
    grid-template-columns: 1fr;
    grid-template-rows: max-content repeat(6, 1fr);
  }
  .portada-titulo{
    font-size: 1.8em;
  }
  #portada h1, #portada h2{
    margin: auto;
  }
  div.txt-one, div.txt-two{
    font-size: .75em;
  }
  div.txt-two span {
    margin-left:-270px;
  }
  @keyframes showup {
      0% {opacity:0;}
      20% {opacity:1;}
      80% {opacity:1;}
      100% {opacity:0;}
  }
  @keyframes slidein {
      0% { margin-left:-800px; }
      20% { margin-left:-800px; }
      35% { margin-left:0px; }
      100% { margin-left:0px; }
  }
  @keyframes reveal {
      0% {opacity:0;width:0px;}
      20% {opacity:1;width:0px;}
      30% {width:270px;}
      80% {opacity:1;}
      100% {opacity:0;width:270px;}
  }
  .que-buscas{
    font-size: 1.5em;
  }
  .error404-h{
    font-size: 2.5em;
  }
  .negro404{
    font-size: .9em;
  }
  .box{
    /*min-width: 260px;*/
  }
  .empleo-campos {
    grid-template-areas:
      "empleo-ca"
      "empleo-cb"
      "empleo-cc"
      "empleo-cd"
      "empleo-ce"
      "empleo-cf"
      "empleo-politica"
      "adjunta-cv"
      "curriculum-btn";
    grid-template-columns: 1fr;
  }
  .cantidad-precio .agregando,.quantity{
    margin-top: .5em;
  }
  .contenedor-carrito{
    margin-right: 0;
  }
  .home-text p span{
    font-size: 1.1em;
  }
  .home-text div h2{
    font-size: 1.2em;
  }
  #contenedor-metodos .consignaciones-txt h2{
    font-size: 1.5em;
  }
  .pushbar.from_top{
    max-width: 94%;
  }
  .aviso-txt h2{
    font-size: 1.5em;
  }
}
@media(max-width: 355px){
  .secciones-form{
    justify-content: center;
  }
  .empleo-btns {
    grid-template-areas: 
      "lk-btn"
      "fb-btn";
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, 1fr);
  }
  .cotizar-btn{
    font-size: .8em;
  }
  .home-text p span{
    font-size: 1em;
  }
  .home-text div h2{
    font-size: 1em;
  }
  #equipo h2{
    font-size: 2em;
  }
  #contenedor-metodos .consignaciones-txt h2{
    font-size: 1.15em;
  }
}
@media(max-width: 340px){
  .micono{
    justify-content: flex-start;
    width: 100%;
  }
  .micono:nth-child(2),.micono:nth-child(4){
    justify-content: flex-start;
  }
  .linea-ver{
    display: none;
  }
  .que-buscas{
    font-size: 1.2em;
  }
  .menupb-logob-carritob{
    grid-gap: .7em;
  }
  .contenedor-contadores{
    grid-template-areas:
      "clienteshome"
      "proyectoshome"
      "gustahome"
      "soportehome"
      "trayectoriahome"
      "garantiahome";
    grid-template-columns: 1fr;
    grid-template-rows: repeat(6, max-content);
  }
  .contando:nth-child(5){
    margin-bottom: 3em;
  }
  #extra-icob ul li{
    /*height: 38px;*/
    width: 38px;
  }
  .titulo-psd{
    font-size: 1.8em;
  }
  .titulo-legal h2{
    font-size: 1.6em;
  }
}
@media(max-width: 310px){
  .contact100-form-title{
    font-size: 1.2em;
  }
  div.txt-one, div.txt-two{
    font-size: .55em;
  }
  div.txt-two span {
    margin-left:-200px;
  }
  @keyframes showup {
      0% {opacity:0;}
      20% {opacity:1;}
      80% {opacity:1;}
      100% {opacity:0;}
  }
  @keyframes slidein {
      0% { margin-left:-800px; }
      20% { margin-left:-800px; }
      35% { margin-left:0px; }
      100% { margin-left:0px; }
  }
  @keyframes reveal {
      0% {opacity:0;width:0px;}
      20% {opacity:1;width:0px;}
      30% {width:200px;}
      80% {opacity:1;}
      100% {opacity:0;width:200px;}
  }
  .pos-footer div{
    width: 100%;
  }
  .que-buscas{
    font-size: 1em;
  }
  .cd-search input{
    font-size: .9em;
  }
  .box{
    /*min-width: 220px;*/
  }
  .author{
    font-size: .9em;
  }
  .soporte-list li{
    font-size: .78em;
  }
  .empleo-btns {
    grid-template-areas:
      "lk-btn"
      "fb-btn";
    grid-template-columns: 1fr;
    grid-template-rows: 2fr;
  }
  #equipo h2{
    font-size: 1.5em;
  }
  .nosotros-home-txt h2,.productos-nuevos h2,#equipo h2,#contenedor-formas h2,
  #contenedor-metodos h2, #contenedor-preguntas h2,.eventos-txt h2,.diseno-grafico-title h2,
  .complemento-evento h2,.titulo-ux-ui,.titulo-delo-ux{
    font-size: 2.1em;
  }
  .titulo-legal h2{
    font-size: 1.4em;
  }
}