html{
   scroll-behavior: smooth;;
}
body{
    font-family: 'Work Sans', sans-serif;
    font-size:18px;
}

select,
input,
textarea{
    font-family: 'Work Sans', sans-serif;}


*,
body{
    margin:0;
    padding:0;
}
/* Wrappers*/ 
.container{
    width:100%;
    height:100%;
    min-height:100vh;
    overflow:hidden;
    position:relative;
}
.pageContainer{
    width:100%;
    height:100%;
    min-height:100vh;
    position:relative;
}

.flexCols{
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:center;
    width:100%;
    box-sizing:border-box;
}
.flexCols.invert{
    flex-direction: row-reverse;
}

.flexRows{
    display:flex;
    flex-direction:column;
    justify-content:center;
}
.flexRowsCenter{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}
/* Columnas*/

.col10{
    width:10%;
}
.col20{
    width:20%;
}
.col30{
    width:30%;
}
.col35{
    width:35%;
}
.col40{
    width:40%;
}
.col45{
    width:45%;
}
.col50{
    width:50%;
}
.col60{
    width:60%;
}
.col70{
    width:70%;
}
.col80{
    width:80%;
}
.col90{
    width:90%;
}
.col100{
    width:100%;
}

/* Propiedades genericas */ 

.textCenter{
    text-align:center;
}

/* Colores genericos */ 

.blue{
    color:#00DBFF;
}

/* Header */ 
header.head{
    position:absolute;
    top:0;
    right:0;
}
header.fixed{
    position:fixed;
    z-index:20;
}
header.head .headCont{
    display:flex;
    align-items:center;
    justify-content: flex-end;
    box-sizing:border-box;
    margin:0 auto;
    padding:2em;
    z-index:100;
    position:relative;
}

a.backBtn{
    display:none;
    position:fixed;
    top:2em;
    left:2em;
    background: rgba(0,0,0,0.1);
    border:1px solid rgba(255,255,255,0.3);
    outline:0;
    height:3em;
    width:3em;
    padding:0;
    cursor:pointer;
    border-radius:50%;
    transition: all 0.6s ease-out;
    /*Centrado de hijo*/
    flex-direction:column;
    align-items:center;
    justify-content:center;
    z-index:200;
    z-index:999;
}
.pageContainer a.backBtn{
    display:flex;
    
}
a.backBtn:hover{
    background:#fff;
    margin-left:0.2em;
}
a.backBtn:hover .fil0{
    fill:#000;
}


a.backBtn svg{
    width:1em;
    height:1em;
}
a.backBtn .fil0{
    fill:#fff;
}
a.backBtn span{
    display:none;
    text-indent:-9999px;
}

/* Botón del menú depslegable */
header.head .headAside button.iconMenu{
    background:none;
    position:relative;
    border:1px solid rgba(255,255,255,0.3);
    outline:0;
    height:4em;
    width:4em;
    padding:0;
    cursor:pointer;
    border-radius:50%;
    transition: all 0.6s ease-out;
    /*Centrado de hijo*/
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    z-index:200;
}
/*Arreglo en fixed*/
header.fixed .headAside button.iconMenu{
    background: rgba(0,0,0,0.1);
}
header.head .headAside button.iconMenu svg{
    width:1.6em;
    height:1.6em;
}
header.head .headAside button.iconMenu:hover{
    background:#fff;
    margin-right:0.2em;
}
header.head .headAside button.iconMenu svg .fil0{
    fill:#fff;
}
header.head .headAside button.iconMenu:hover svg .fil0{
    fill: #000;
}
header.head .headAside button.iconMenu span.textIconMenu{
    display:none;
}

/* Despliegue del menu*/ 
nav.navMenu{
    transition: all 0.3s ease-out;
    position:fixed;
    right:-100%;
    top:0;
    bottom:0;
    z-index:101;
    padding-top:7em;
    padding-right:2em;
    padding-left:10em;
    padding-bottom:4em;
}
header nav.navMenu.active{
    position:fixed;
    right:0;
    box-sizing:border-box;
    background: linear-gradient(to left , rgba(0,0,0,0.60), rgba(0,0,0,0));
}
nav.navMenu.active{
    right:0;
}
nav.navMenu ul{
    list-style-type:none;
    color:#fff;
    text-align:right;
}
nav.navMenu ul li.separator{
    border-bottom:1px solid rgba(255,255,255,0.1);
    margin:0.5em 0 0;
}
nav.navMenu ul li span{
    display:block;
    padding:0 0 0.8em;
    color:#ccc;
    font-size:0.5em;
    text-transform:uppercase;
    letter-spacing:0.2em;
}
nav.navMenu ul li a{
    color:#fff;
    display:block;
    text-decoration:none;
    transition: all 0.3s linear;
    padding:1em 0 1em;
    font-weight:bold;
    font-size:1em;
}
nav.navMenu ul li a:hover{
    color:#333;
}
nav.navMenu ul li a.navContacto:hover{
    color:#333;
}
/* Submenu*/ 
nav.navMenu ul.submenu{}
nav.navMenu ul.submenu li{
    font-size:1em;
}
nav.navMenu ul.submenu li a{
    padding:0.4em 0 0.4em;
}
nav.navMenu ul.submenu li:last-child{
    margin-bottom:1em;
}

/* Portada principal de home y secciones */ 
section.mainHome{
    width:100%;
    height:100vh;
    overflow:hidden;
    background:#000;
}

section.pageTop{
    width:100%;
    height:100vh;
    overflow:hidden;
    background:#000;
}

/* Slide de video */ 
.slideCont{
    position:relative;
    width:100%;
    height:100%;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    font-size:22px;
}
/* Video de fondo */ 
.slideCont .slideVideo{
    position:absolute;
    top:0;
    left:0;
    right:0;
    z-index:0;
}
.slideCont .slideVideo{
    min-width:1800px;
}
/* Capa por delante del video */
.slideCont .slideLogo,
.slideCont .slideText,
.anchorArrow,
footer .footerInfoCont{
    z-index:15;
}
/* Logo sobre video */
.slideLogo{
    text-align:center;
}
.slideLogo .logo{
    position:relative;
    width:100%;
}
.slideLogo .logo .slogan{
    position:absolute;
    top:0;
    right:-22%;
    width:33%;
}
.slideLogo .logo svg{
    width:100%;
}
.slideLogo .logo svg .fil0{
    fill:#fff;
    color:#fff;
}
.slideLogo .logo .slogan svg .fil0{
    animation-name: changeFillColor;
    animation-duration: 15s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    opacity:0.9;
}

/* Texto sobre el slide o video */
.slideLogo .logo span{
    display:none;
}
.slideText{
    color: #fff;
    padding:0.5em 0 0;
    text-align:center;
    width:40%;
}
.mainHome .slideText h1{
    font-weight:normal;
    font-size: 1.5em;
    color:rgba(255,255,255,0.4);
    letter-spacing:1px;
}
.mainHome .slideText h2{
    font-weight:lighter;
    font-size:1.2em;
    color:rgba(255,255,255,0.5);
    padding:0.5em 0 0;
}
.slideText h1 span{
    display:block;
}
.slideText h1 b{
    font-weight:bold;
}

.slideText p{
    padding:1em 0 0.5em;
    font-size:0.8em;
    color:#ccc;
    line-height:1.4em;
}
.slideText p a{
    color:#e9e9e9;
    text-decoration:none;
}
.slideText p a:hover{
    color:#fff;
}

/* Exepciones para pageTop */
.pageTop .slideText{
    width:50%;
    padding-top:1.5em;
}
.pageTop h1{
    font-weight:bold;
    color:rgba(255,255,255,0.7);
    font-size:1.6em;
}
.pageTop h2{
    font-weight:lighter;
    color:rgba(255,255,255,0.3);
    font-size:1.2em;
    padding:0.2em 0;
    
}

@keyframes changeColor{
    0%   {color:#FF5100;}
    25%  {color:#FA00FF;}
    50%  {color:#00DBFF;}
    75%  {color:#00FF16;}
    100% {color:#FFF900;}
}

/* Boton de whatsapp*/ 
.WABtn{
    position:fixed;
    right:2em;
    bottom:2em;
    width:3em;
    height:3em;
    z-index:110;
}
.iconWA{
    cursor:pointer;
    position:relative;
    opacity:0.5;
    transition: all 0.6s ease-out;
}
.iconWA a.WALink{
    outline:0;
    display:block;
    border-radius:100px;
}
.iconWA svg{
    width:3em;
    height:3em;
}

.iconWA .fil0{
    fill:#25D366;}
.iconWA .fil1{
    fill:#fff;}



.iconWA span{
    display:none;
    background: rgba(0,0,0,0.8);
    padding:0.5em 1em;
    color:#ccc;
    white-space: nowrap;
    font-size:0.7em;
    border-radius:100px;
}
.iconWA:hover{
    opacity:0.9;
}
.iconWA:hover span{
    display:block;
    position:absolute;
    top:-3em;
    right:0;
}

/*Estructura y generalidades de los block 100vh de pantalla*/
section.bigBlock{
    width:100%;
    height:100%;
    min-height:100vh;
    position:relative;
    box-sizing:border-box;
    overflow:hidden;
    /*Centrado de hijo*/
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
}
section.bigBlock.adjustHeightBlock{
    height:auto;
    min-height:auto;
}

section.bigBlock .blockPic img{
    max-width:100%;
}

.mask:before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    opacity:0.95;
}

/*BigPage automatizados*/
.bPLeft{
    padding: 2% 16% 8em 0;
}
.bPRight{
    padding:2% 0 8em 16%;
}
.bPCenter{
    padding:2% 16% 8em 16%;
}
.bPRight .flexCols,
.bPCenter.invert .flexCols{
    flex-direction: row-reverse;
}
.bigPage .blockText{
    box-sizing:border-box;
}
.bPRight .blockText{
    padding:0 15% 0 0;
}
.bPLeft .blockText{
    padding:0 0 0 15%;
}
.bPCenter .blockText{
    padding:0 0 0 10%;
}
.bPCenter.invert .blockText{
    padding: 0 10% 0 0;
}



/*Capa del contenedor interno del Block*/
section.bigBlock .blockCont{
    z-index:11;
}
/*Tonalidad del fondo del Block*/
.light{
    color:#333;
}
.dark{
    color:#fff;
}

/*Cambios de padding de blocks*/
section.bigBlock .bigLeft{
    padding:2% 16% 2% 0;
}
section.bigBlock .bigRight{
    padding:2% 0 2% 16%;
}
section.bigBlock .bigCenter{
    padding:2% 16% 8em;
}
section.bigBlock .bigCenterCond{
    padding:2% 18% 8em;
}



/*Elementos y formatos de textos de los block de pantalla*/

.ancla{
    width:2em;
    height:0.5em;
    background:#fff;
    margin:0 0 2em;
}
section.bigBlock h2{
    font-size:3.6em;
    line-height:0.9em;
    padding:0 0 0.8em;
    letter-spacing:-0.03em;
}
section.bigBlock h3{
    font-size:2.6em;
    line-height:0.7em;
    padding:0 0 0.7em;
    letter-spacing:-0.03em;
}
section.bigBlock h3.subtitle{
    padding:0 0 2.5em;}
section.introHome h3 span{
    display:block;
}
section.bigBlock p{
    font-size:1.4em;
    line-height:1.1em;
    padding:0 0 1em;
    font-weight:normal;
}

/*Contenedor de imagenes de los blocks*/
section.bigBlock.introPage .blockPic .wrapperPic .pic img{
    max-width:90%;
}
section.bigBlock .blockPic .wrapperPic .pic img{
    max-width:100%;
}
.picRight{
    text-align:right;
}
.picLeft{
    text-align:left;
}
.picCenter{
    text-align:center;
}
.picCenter svg{
    width:50%;
    height:50%;
}
.light .picCenter .fil0{
    fill:#333;
}
.light .picCenter .fil1{
    fill:#333;
}
.dark .picCenter .fil0{
    fill:#fff;
}
.dark .picCenter .fil1{
    fill:#ccc;
}


/* Listado de items en Bloque */

ul.listBlock{
    list-style-type:none;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4em;
}
ul.listBlock li{}
ul.listBlock li .icon{
    width:5em;
    height:5em;
    margin:0 auto 2em;
}
ul.listBlock li .icon img{
    max-width:5em;
    max-height:5em;
}
ul.listBlock li .icon svg .fil0{
    fill: #333;
}
ul.listBlock li h4{
    font-size:1.2em;
    padding:0 0 1em;
    color:#333;
    transition: all 0.3s ease-out;
}
ul.listBlock li p{
    font-size:0.9em;
    line-height: 1.6em;
    letter-spacing:0.01em;
}

/* Listado vertical */

ul.verticalList{
    list-style-type:none;
}
ul.verticalList li a.itemList{
    display:flex;
    flex-direction:row;
    align-items:center;
    text-decoration:none;
}
ul.verticalList li a.itemList span{
    display:block;
}
ul.verticalList li a.itemList span.icon{
    width:48px;
    margin-right:1em;
}
ul.verticalList li a.itemList span.icon svg{
    width:48px;
}
ul.verticalList li a.itemList span.text{
    font-size:1em;
}

/*Listado vertical - Colores*/
.dark ul.verticalList li a.itemList{
    color:#fff;
}
.light ul.verticalList li a.itemList{
    color:#333;
}


/* Listadocon imagen de fondo */

ul.listPicBlock{
    list-style-type:none;
    width:100%;
    margin:0;padding:0;
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap:0.1em 0.4em;
}
ul.listPicBlock li a{
    display:block;
    width:100%;
    position:relative;
}
ul.listPicBlock li:hover a:before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background: rgba(0,0,0,0.5);
}
ul.listPicBlock li a img{
    width:100%;
}
ul.listPicBlock li a span.title{
    display:none;
    position:absolute;
    bottom:1em;
    left:1em;
    background: rgba(0,0,0,0.5);
    color:#fff;
    border-radius:150px;
    padding:5px 10px;
    font-size:0.8em;
    
    
}
ul.listPicBlock li:hover a span.title{
    display:block;
}
ul.listPicBlock li a span.link{}


/* Listado de caracteristicas */
ul.listBlock.listFeatures{
    text-align:center;
}
.featuresWeb ul.listBlock.listFeatures{
    grid-template-columns: repeat(3, 1fr);
    gap: 4em;
}
.featuresWeb ul.listBlock.listFeatures li .icon svg{
    width:5em;
}

/*BOTONES: Generalidades*/
.btnGroup{
    padding:1em 0;
}
.btn{
    display:inline-block;
    border:0;
    outline:0;
    border-radius:3px;
    text-decoration:none;
    background:none;
    padding:1em;
    font-size:1em;
    border:1px solid rgba(0,0,0,0.5);
    transition: all 0.6s ease-out;
    margin-bottom:2%;
}
.btn.secondary{
    background:none;
    border:0;
}
/*BOTONES: Colores dark*/
.dark .btnGroup .btn{
    background:none;
    border:1px solid rgba(255,255,255,0.3);
    color:#fff;
}
.dark .btnGroup .btn:hover{
    background:#fff;
    color:#333;
}
.dark .btnGroup .btn.secondary{
    background:none;
    border:0;
}
/*BOTONES: Colores light*/
.light .btnGroup .btn{
    background:#fff;
    border:1px solid rgba(0,0,0,0.3);
    color:#333;
    
}
.light .btnGroup .btn:hover{
    background:#333;
    color:#fff;
}
.light .btnGroup .btn.secondary{
    background:#f1f1f1;
    border:1px solid rgba(0,0,0,0.01);
    color:#666;
}
.light .btnGroup .btn.secondary:hover{
    border:1px solid rgba(0,0,0,0.3);
    background:none;
    color:#000;
}


/* Blocks del HOME */

/*Block Intro Home*/
section.introHome{
    background: url(../img/bg_intro.jpg) no-repeat fixed center/cover;
    color:#fff;
}
section.introHome:before{
    background: linear-gradient(to right top , #222, #000);
    opacity: 0.93;
}
section.introHome h1 span{
    white-space: nowrap;
}
section.introHome p{
    color:#fff;
}


/*Block de Redes Sociales*/
section.redesHome .blockText{
    box-sizing:border-box;
    padding-right:15%;
}
/*Block de Páginas Web*/
section.webHome .blockText{
    box-sizing:border-box;
    padding-left:15%;
}
/*Block Como Hacemos*/
section.itemsHome{
    text-align:center;
    border-top:1px solid #f1f1f1;
    background: linear-gradient(to top , #f1f1f1, #fafafa);
}
section.itemsHome p.subtitle span{
    display:block;
}
/*Block Servicios*/
section.servicios{
    text-align:center;
    background: linear-gradient(to right top , #fff, #fafafa);
}
section.servicios ul.listBlock{
    gap:2em;
}
section.servicios ul.listBlock li{
    cursor:pointer;
    position:relative;
    display:block;
}
section.servicios ul.listBlock li .contLi{
    padding:0.4em 1.4em;
}
section.servicios ul.listBlock li .contLi:hover{
    box-shadow:0 0 30px 10px rgba(0, 0, 0, 0.04);
    background:#f1f1f1;
    position:absolute;
    padding:1.4em 2.4em;
    top:-1em;
    left:-1em;
    right:-1em;
    bottom:-1em;
}
section.servicios ul.listBlock li .contLi:hover h4{
    padding:0 0 0.8em;
}
section.servicios ul.listBlock li .icon{
    background:#fff;
    border-radius:100%;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    margin: 0 auto 1em;
}
section.servicios ul.listBlock li .icon img,
section.servicios ul.listBlock li .icon svg{
    width:4em;
    height:4em;
}
section.servicios ul.listBlock li:hover .icon svg{
    animation-name: rotateY;
    animation-duration: 1s;
}



/*Icono Diseño Grafico*/
section.servicios ul.listBlock li .icon .fil0{
    fill:none;
}
section.servicios ul.listBlock li .icon .fil1{
    fill:#333;
}



/*Footer*/
footer{
    width:100%;
    min-height:100vh;
    background:#333;
}
footer .footerCont{
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
}

footer .map{
    width:100%;
    height:100vh;
}
footer .map iframe{
    width:100%;
    height:100%;
}
footer .footerInfo{
    padding:5em;
    position:relative;
    box-sizing:border-box;
    background: url(../img/bg_footer.jpg) no-repeat fixed center/cover;
}
footer .footerInfo.mask:before{
    background:#111;
}
footer .footerTitle{
    margin:0 0 2em;
}
footer .footerTitle h2 span.typedTitleFooter{
    font-size:1.8em;
}

/* Listado de contacto */
footer ul.verticalList{
    padding-bottom:0;
}
footer ul.verticalList li a.itemList{
    padding:0.4em 0;
}
footer ul.verticalList li .icon .fil0{
    fill:#fff;
}
footer ul.verticalList li a.itemList span.text{
    font-size:1.5em;
    letter-spacing:-0.01em;
    font-weight:bold;
}
footer ul.verticalList li:last-child a.itemList span.text{
    font-size:1em;
    letter-spacing:0.01em;
    font-weight:normal;
}







/* p a g e s */

/* Genericos sobre Bloques de páginas secundarias */
.bigBlock.firstPageBlock{
    padding-top:5em;
}


/*Block PAGE: Estrategia digital */

.bigBlock.eDIntro,
.bigBlock.presuEstrategia{
    background: url(../img/bg-page-estrategia-digital.jpg) no-repeat fixed center/cover;
}
.bigBlock.eDIntro .picCenter .fil0{
    fill:#fff;
}
section.eDIntro:before,
.bigBlock.presuEstrategia:before{
    background: linear-gradient(to right top , #701CE6,#17C0C7);
}

/*Block PAGE: Redes sociales */
section.redesIntro,
section.presuRedes{
    background: url(../img/bg-page-redes-sociales.jpg) no-repeat fixed center/cover;
}
section.redesIntro:before,
section.presuRedes:before{
    background: linear-gradient(to right top , #B600C2, #3183e9);
}

/*Block PAGE: Diseño gráfico */
section.dGIntro,
section.presuDG{
    background: url(../img/bg-page-diseno-grafico.jpg) no-repeat fixed center/cover;
}
section.dGIntro:before,
section.presuDG:before{
    background: linear-gradient(to right top , #F2490C, #F22786);
}

/*Block PAGE: Diseño Web */
section.dWIntro,
.bigBlock.presuWeb{
    background: url(../img/bg-page-diseno-web.jpg) no-repeat fixed center/cover;
}
section.dWIntro:before,
.bigBlock.presuWeb:before{
    background: linear-gradient(to right top , #238BE6, #00EB27);
}
section.bigBlock.webWorkBlock{
    padding:3em 0;
}
section.bigBlock.webWorkBlock h3{
    line-height:0.9em;
    padding:2em;
    letter-spacing:-0.05em;
    font-size:2em;
    font-weight:normal;
    text-align:center;
    color:#666;
}
section.bigBlock.webWorkBlock .ancla{
    margin:0 auto;
    background:#ccc;
}



/*Block PAGE: Google Ads */
section.gAdsIntro,
section.presuGA{
    background: url(../img/bg-page-googleads.jpg) no-repeat fixed center/cover;
}
section.gAdsIntro:before,
section.presuGA:before{
    background: linear-gradient(to right top , #e9e9e9, #fff);
    opacity: 0.85;
}
section.gSearchBlock .fil1{
    fill:#fff;
}
section.bigBlock.gAdsIntro .ancla{
    background:#333;
}
section.gAdsIntro h2 {
    padding: 0 0 0.5em;
}
section.gAdsIntro h2 svg{
    display:block;
    height:1.2em;
    padding:0.15em 0 0;
}

/*Block PAGE: Posicionamiento */
section.posicionIntro,
section.presuPos{
    background: url(../img/bg-page-posicionamiento.jpg) no-repeat fixed center/cover;
}
section.posicionIntro:before,
section.presuPos:before{
    background: linear-gradient(to right top , #57BF26, #CBF71B);
}

/*Block PAGE: Analisis y Big Data */
section.bigDataIntro,
section.presuData{
    background: url(../img/bg-page-analytics.jpg) no-repeat fixed center/cover;
}
section.bigDataIntro:before,
section.presuData:before{
    background: linear-gradient(to right top , #196AF5, #20E8E7);
}

/*Block PAGE: Google Workspace */
section.workspaceIntro,
section.presuGW{
    background: url(../img/bg-page-workspace.jpg) no-repeat fixed center/cover;
}
section.workspaceIntro:before,
section.presuGW:before{
    background: linear-gradient(to right top , #e9e9e9, #fff);
}
section.workspaceBlock .blockPic .wrapperPic .pic img{
    max-width:80%;
}



/* FORMULARIO GENERICO*/

.form .formTitle{
    padding:0 0 0.5em;
}
.form .formTitle legend{
    font-size:2em;
    padding:0 0 0.2em;
    font-weight:bold;
}
.form .formTitle p{
    font-size:1em;
}

.form .campo{
    padding:0 0 0.3em;
}
.form .campo select,
.form .campo input,
.form .campo textarea,
.form .btnForm input{
    width:100%;
    box-sizing:border-box;
    padding:0.8em;
    font-size:1em;
    background:#fff;
    color:#000;
    border:1px solid #e9e9e9;
    border-radius:3px;
    transition: all 0.6s ease-out;
    outline:0;
}
.form .campo select option{
    color:#333;
}

/* FORMULARIO */

.formPresu{
    width:50%;
    margin:0 auto;
}
.form.formPresu .formTitle{
    text-align:center;
}
.formPresu .campo{}
.formPresu .campo select{
    display:none;
}
.formPresu .campo select,
.formPresu .campo input,
.formPresu .campo textarea,
.formPresu .btnForm input{
    opacity:0.7;
    background:none;
    border:1px solid rgba(0,0,0,0.5);
    padding:1em;
    font-size:1.4em;
}

.dark .formPresu .campo select,
.dark .formPresu .campo input,
.dark .formPresu .campo textarea,
.dark .formPresu .btnForm input{
    border:1px solid rgba(255,255,255,0.5);
}

.formPresu .campo select:hover,
.formPresu .campo input:hover,
.formPresu .campo textarea:hover{
    border:1px solid rgba(255,255,255,1);
    background: rgba(255,255,255,0.2);
}
.light .formPresu .campo input::placeholder,
.light .formPresu .campo textarea::placeholder{
    color:#333;
}
.dark .formPresu .campo input::placeholder,
.dark .formPresu .campo textarea::placeholder{
    color:#fff;
}
.formPresu .btnForm{}
.formPresu .btnForm input{
    background:#fff;
    color:#333;
    font-weight:bold;
    font-size:1.4em;
    opacity:0.7;
    border:1px solid rgba(0,0,0,0.2);
    cursor:pointer;
    transition: all 0.6s ease-out;
}
.formPresu .btnForm input:hover{
    background:rgba(255,255,255,0.5);
    opacity:1;
}

.light .formPresu .btnForm input{
    background:#333;
    color:#fff;
}
.light .formPresu .btnForm input{
    background:rgba(0,0,0,0.5);
}

.formError p#stopMensaje{
    padding:0 0 0.1em;
}
.formError p#stopMensaje span{
    display:block;
    border-radius:3px;
    background: rgba(0,0,0,0.3);
    color:#fff;
    font-size:0.6em;
    padding:1em;
}