/*===================================================================================*/
/*  00 - Estructura
/*===================================================================================*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, input, textarea, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video 
{ font-family: "Trebuchet MS", Arial; }

ul, ol { font-size: 0px; }
ul a, ul li, ol a, ol li, a, p { font-size: 14px; }
a, li, section { display: inline-block; }
a, li, div, section { vertical-align: top; }
div, section { font-size: 0px; }

.content { width: 1000px; margin: 0px auto;}
.content.main { padding: 30px 0px 70px 0px; }
.background-grey { width: 100%; background-color: #efefef; }

pre.debug { font-size: 12px; }

/* Header */
header #logo-block { width: 1000px; margin: 0px auto; padding: 20px 0px; }
/*
header #logo-block #logo { display: inline-block; width: 210px; margin-right: 70px; vertical-align: middle;  }
*/
header #logo-block #logo { display: inline-block; width: 21%; margin-right: 7%; vertical-align: middle;  }
header #logo-block ul#social-menu li { margin-left: 5px; }
header #submenu-idiomas{ display:inline-block; width: 70%; margin: 20px 0px 10px 0px; }
header #logo-block ul#secondary-menu { display: inline-block; width: 100%; text-align: right; }
header #logo-block ul#secondary-menu li { margin-left: 10px; padding: 10px 0px 8px 0px; display: inline-block; vertical-align: middle; }
header #logo-block ul#secondary-menu li.configure { padding-left: 30px; padding-right: 10px; border-radius: 5px; background: url(../img/configura.png) no-repeat 8px center #ebebeb; }
header #logo-block ul#secondary-menu li:first-child { margin-left: 0px; }

header #logo-block ul#secondary-menu li a { opacity: .4; color: #000000; font-size: 11px; font-weight: bold; text-transform: uppercase; }
header #logo-block ul#secondary-menu li a:hover { opacity: .7; }
header #menu-block { text-align: center; background-color: #f10101; width:100%;}
header #menu-block #menu { margin: 0px auto; width: auto; vertical-align: middle; }
header #menu-block #menu li { padding: 20px 0px; margin: 0px;   }
header #menu-block #menu li.selected { background: url(../img/menu-active.png) no-repeat center bottom; }
header #menu-block #menu li:last-child { margin-right: 0px; }
header #menu-block #menu li a { color: #ffffff; font-weight: bold; font-size: 19px; letter-spacing: 0.5px; opacity: .9; }
header #menu-block #menu li a:hover { opacity: .5; }
header #logo-block div#service-info { display: inline-block; width: 21%; text-align: right; vertical-align: middle; }
header #logo-block div#service-info p.text { color: #000000; font-weight: bold; font-size: 12px; line-height: 16px; }
header #logo-block div#service-info p.phone { color: #dc0000; font-size: 24px; line-height: 28px; }
header #logo-block div#service-info p.email a { color: #999999; font-weight: bold; font-size: 12px; line-height: 16px; }

#home div#titular,#pago-correcto div#titular,#pago-incorrecto div#titular, #redireccion-tpv div#titular{width: 100%; padding: 40px 0px; background-color: #f3f3f3;}
#home div#titular h1,#pago-correcto div#titular h1,#pago-incorrecto div#titular h1,#redireccion-tpv div#titular h1{ font-size: 48px; color:#000000; text-transform: uppercase; font-weight: bold; text-align: left; max-width:1000px; margin: 2% auto;}
#home div#titular p,#pago-correcto div#titular p, #pago-incorrecto div#titular p, #redireccion-tpv div#titular p{ text-align: left; font-size: 24px; line-height: 36px; max-width:1000px; margin: 2% auto;}
#home div#titular p strong a, #pago-correcto div#titular p strong a, #pago-incorrecto div#titular p strong a,#redireccion-tpv div#titular p strong a{text-decoration:underline; font-weight: bold; vertical-align: initial; font-size:24px;}

#home div#formulario {max-width: 1000px; margin: 3% auto; text-align: center;}
#home div#formulario div.datos-personales {border-bottom: 2px solid rgba(0,0,0,0.1); padding-bottom:20px; margin-bottom: 30px;}
#home div#formulario div.datos-transaccion {margin-bottom: 50px;}
#home div#formulario div.texto-informativo {text-align: right; padding-right: 40px;}
#home div#formulario div.texto-informativo p{font-weight: bold;}
#home div#formulario div.texto-informativo span {color: #f10101;}
#home div#formulario div.texto-transferencia {text-align: center; padding-bottom: 40px;}
#home div#formulario div.texto-transferencia p{font-weight: normal;}
#home div#formulario div.texto-transferencia span {color: #f10101;}

#home div#formulario div.campo{width: 49%; display: inline-block; margin: 0 0 0 1%;}
#home div#formulario div.errorFormulario input{background-color: #F7ADBE; border: 2px solid #FA0A42;}
#home div#formulario div.importe{width: 20%;}
#home div#formulario div.texto-euros{width: 78%; padding-top: 10px;}
#home div#formulario div.texto-euros p{text-align: left; padding: 43px 0 0 25px;}
#home div#formulario div.campo label p{ color: #000000; font-size: 16px; font-weight: bold; padding: 10px 0; text-align: left;}
#home div#formulario div.checkbox{padding-top:20px; width: 68%;}
#home div#formulario div.checkbox label p{font-weight: normal; font-size:12px; text-align: left;}
#home div#formulario div.checkbox label input{margin-right: 10px; text-align: left;}
#home div#formulario div.checkbox label span a{text-decoration: underline; font-weight: normal; color: #000000; font-size:12px; vertical-align: initial;}
#home div#formulario div.boton{ width: 28%; padding-right: 2%;}
#home div#formulario div.campo span{ color: #f10101; font-weight: bold; font-size: 17px;}
#home div#formulario input[type=text],#home div#formulario input[type=email]{display: block;width: 92%;font-size: 16px;line-height: 36px;border: 1px solid #999999;border-radius: 5px;padding: 5px 10px;margin-bottom: 30px;}

#pago-incorrecto div#contenido,#pago-correcto div#contenido{width: 100%; text-align: center;}
#pago-incorrecto div#contenido p,#pago-correcto div#contenido p{font-size:24px; margin: 40px auto;}
#pago-incorrecto div#contenido p strong,#pago-correcto div#contenido p strong{font-weight: bold;}
#pago-incorrecto div#contenido a,#pago-correcto div#contenido a{margin-bottom: 40px;}



/* Footer */
footer { background-color: #1c1c1b; }
footer div.blocks { position:relative; width: 1000px; margin: 0px auto; padding: 50px 0px; }
footer div.blocks > div { display: inline-block; }
footer div.blocks > div a:hover { color: #ffffff; opacity: .6; }

footer a, footer p { color: #ffffff; opacity: .8; font-size: 14px; }
footer a:hover { color: #ffffff; opacity: .6; }
footer p { font-weight: bold; margin-bottom: 0px; }

footer div.products-footer {background: url(../img/logo_pie.png) no-repeat left top;  width: 100%; height: 29px; opacity: 0.3; margin-bottom: 10px;}
footer div.products-footer a.title { display: block; font-size: 16px; font-weight: bold; margin-bottom: 10px; }
footer div.products-footer a.title.margins { margin-top: 30px; margin-bottom: 20px; }
footer div.products-footer p { font-size: 16px; }
footer div.products-footer ul li { background: url(../img/bullet_listado_pie.png) no-repeat left center; padding-left: 10px; margin-bottom: 5px; width: 100%; }
footer div.products-footer ul li a { line-height: 15px; opacity: .6; }
footer div.products-footer ul li a:hover { opacity: .4; }

footer div#menu-footer { width: 20%; }
footer div#menu-footer ul li { display: block; margin-bottom: 15px; }
footer div#menu-footer ul li:last-child { margin-bottom: 0px; }
footer div#menu-footer ul li a { font-size: 16px; }

footer div#secondary-menu-footer { width: 31%; }
footer div#secondary-menu-footer ul li { display: block; }
footer div#secondary-menu-footer ul li a { opacity: .4; font-size: 11px; line-height: 18px; font-weight: bold; text-transform: uppercase; }
footer div#secondary-menu-footer ul li a:hover { opacity: .2; }

footer div#secondary-menu-footer > a { background: url(../img/flecha_boton_pie.png) no-repeat 8px center; margin-top: 49px; margin-left: 155px; border-radius: 4px; background-color: #2f2f2f; padding: 9px 10px 9px 20px; opacity: .4; font-size: 11px; font-weight: bold;  }
footer div#secondary-menu-footer > a:hover { opacity: .7;  }

footer hr { clear: both; display: block; height: 0px; font-size: 0px; width: 100%; border: 0px solid #000000; border-top: 1px solid #272726; margin: 30px 0px 30px 0px; }

footer div#erreka-copyright { padding: 0px; opacity: .3; width: 45%; vertical-align: bottom; }
footer div#erreka-copyright p { font-weight: normal; }

footer div#links-footer { padding: inherit; width: 45%; text-align: right; position: absolute; bottom: 0; }
footer div#links-footer a { font-weight: normal; text-decoration: underline; opacity: .4; margin-right: 15px; }
footer div#links-footer a:hover { opacity: .2; }

footer div#social-menu-footer { text-align: right; width: 19%; }
footer div#social-menu-footer ul { margin-top: 35px; }
footer div#social-menu-footer ul li { display: inline; margin-left: 5px; }
footer div#social-menu-footer ul li span { display: inline-block; color: #494949; margin-left: 10px; }
footer div#social-menu-footer ul li a { display: inline-block; vertical-align: middle; }
footer div#social-menu-footer ul li a img { opacity: .4; }

/* Section-top */

/* Destacado texto secciones */
div.title-block h1{font-size: 42px; font-style: oblique; text-transform: none;font-weight: normal; margin-top: 30px; margin-bottom: 30px; }
div.title-block div.text{ display: inline-block; vertical-align: top; margin-bottom: 30px; width: 100%; font-size: 24px; line-height: 32px; text-transform: none;font-weight: normal; }
div.title-block div.text p{  font-size: 24px; line-height: 32px; text-transform: none;font-weight: normal; margin-bottom: 20px; }
div.title-block img,
div.title-block div.featured-txt { display: inline-block; vertical-align: top; margin-top: 0px; width: 49%; }
div.title-block div.featured-txt { margin-top: 0px; margin-left: 20px; }
div.title-block div.featured-txt h3 { font-size: 18px; line-height: 24px; color: #f10101; }
div.title-block div.featured-txt p { font-size: 18px; line-height: 24px; color: #333333; }
div.title-block div.featured-select { display: inline-block; width: 47%; margin-left: 3%; margin-bottom: 30px;}
div.title-block div.featured-select p span { display: inline-block; width: 100%;}
div.title-block div.featured-select p span.txt { display: inline-block; font-size: 48px; line-height: 52px; color: #f10101; width: 18%;}
div.title-block div.featured-select p span.drop { display: inline-block; font-size: 24px; color: rgba(0,0,0,0.4); border-bottom: solid 1px rgba(0,0,0,0.4); width:70%; text-align: center; cursor: pointer; font-style: italic;}
div.title-block div.featured-select p span.btn-drop { display: inline-block; width:10%; margin-top: 0; cursor: pointer;}
div.title-block div.featured-select p span.btn-drop img { margin-top: 0;}
div.title-block div.featured-select div.options {display: none;}
div.title-block div.featured-select div.option { margin-left: 18%; margin-right: 10%; text-align: center; padding: 2%;border: solid 1px rgba(0,0,0,0.1); border-radius: 5px; cursor: pointer;}
div.title-block div.featured-select div.option a {font-size: 24px;}

ol#breadcrumb li.last { background: none; font-weight: bold; color:#000000;}
ol#breadcrumb li { background: url(../img/arrows-breadcrumb.png) no-repeat right 5px center; padding: 0px 15px 0px 0px;}
ol#breadcrumb li, ol#breadcrumb li a { font-size: 12px; line-height: 24px; color: #666666; }
ol#breadcrumb { width: 100%; border-bottom: 1px solid #ccc; padding-bottom: 10px; display: inline-block; }

.productos.lvl3 ol#breadcrumb { width: 70%; } 

.destacado { padding: 40px 0px 40px 0px;}
.destacado h1 { font-size: 48px; line-height: 55px; margin-top: 25px; font-weight: bold; text-transform: uppercase; }

.productos .main p.main-txt { margin: 30px auto 0px auto; font-size: 18px; color: #333333; line-height: 24px; text-align: center; width: 80%; }
.productos .main h2 { font-style: italic; text-align: center; font-size: 24px; }

.destacado div.title-block { display: inline-block; width: 730px;}
.destacado div.title-block p.category { text-transform: uppercase; font-size: 16px; line-height: 30px; color: #666666; margin: 0px; }
.destacado div.title-block p.category span { color: #f10101; }
.destacado div.title-block ul { margin-top: 20px; }
.destacado div.title-block ul li { background: url(../img/line-red.png) no-repeat left 9px; font-size: 14px; line-height: 18px; margin-bottom: 20px; color: #666666; padding-left: 5%; width: 95%; }
.destacado p { font-size: 16px; line-height: 20px; margin-top: 30px; color: #666666;  }
.destacado p.bold,
.destacado div.bold p { font-size: 24px; line-height: 30px; font-weight: bold; color: #333333; }
.destacado p.bold a,
.destacado div.bold p a { font-size: 24px; line-height: 30px; font-weight: bold; color: #333333; text-decoration: underline; }

.destacado div.right-block { display: inline-block; width: 360px; text-align: center; margin: 75px 0px 0px 30px; }
.destacado div.right-block p { font-size: 24px; line-height: 30px; color: #f10101; }
.destacado div.right-block a { background: url(../img/flecha_boton.png) no-repeat right 40px center #000000; padding: 10px 70px 10px 40px; margin-top: 40px; border-radius: 5px; text-transform: uppercase; font-size: 16px; line-height: 32px; color: #ffffff; font-weight: bold; }

.destacado div.right-img { display: inline-block; overflow: hidden; width: 400px; height: 300px; text-align: center; margin: 30px 0px 0px 40px; }


/* General */
.backto { display: inline-block; margin-top: 25px; width: 50%; }
.backto a { padding-left: 25px; background: url(../img/arrow-backto.png) no-repeat left center; font-size: 14px; color: #666666; }

.pagination { text-align: right; }
.pagination a { font-size: 14px; color: #666666; margin-top: 40px; }
.pagination a.prev { background: url(../img/arrow-backto.png) no-repeat left center; padding-left: 30px; margin-right: 10px; }
.pagination a.next { background: url(../img/arrow-forward.png) no-repeat right center; padding-right: 30px; }

button, .button { cursor: pointer; font-size: 18px; line-height: 36px; text-transform: uppercase; background: url(../img/flecha_boton.png) no-repeat right 30px center #ff0000; border: 0px; border-radius: 5px; padding: 6px 120px 6px 90px; color: #ffffff; }

/*===================================================================================*/
/*  Home
/*===================================================================================*/

.home h2 { text-align: center; color: #000000; font-size: 28px; line-height: 40px; margin: 24px auto 0px auto; width: 960px; font-weight: bold; }
.home p.intro { text-align: center; color: #333333; font-size: 20px; line-height: 32px; margin: 10px auto 0px auto; width: 960px; }
.home .centrado { text-align: center;}
.home .centrado a#gama-puertas { margin-top: 20px; margin-bottom: 10px; font-size: 16px; line-height: 32px; text-transform: uppercase; font-weight: bold; color: #ffffff; border-radius: 5px; background: url(../img/flecha_boton.png) no-repeat right 25px center #de0101; padding: 11px 60px 11px 20px; display: inline-block;}

.home div.grey { background-color: #efefef; margin-top: 30px; padding: 16px 0px; text-align: center; }
.home div.grey h2 { color: #666666; font-size:24px; line-height: 24px; margin-top: 20px; text-transform: uppercase; }
.home div.grey p { color: #666666; font-size:24px; line-height: 24px; margin-top: 20px; }
.home div.grey p strong { color:#000000; font-size:28px; line-height: 24px; margin-top: 20px; font-weight: bold;}
.home div.grey hr { display: block; border: 0px solid black; border-top: 1px solid #999999; width: 100%; margin-top: 20px; height: 1px; }

.home h3 { text-align: center;  color: #666666; font-size:24px; line-height: 24px; text-transform: uppercase;margin: 40px auto; }


div.sub-pie { background-color: #f10101; margin-top: 60px; padding: 0px 0px; text-align: center;  position: relative;height: auto;}
div.sub-pie img{ position: absolute;bottom:0px;left:10;}
div.sub-pie p { color:#ffffff; font-size: 18px; line-height: 24px; text-align: left; margin: 35px auto 10px 200px; display: inline-block; width: 460px;}
div.sub-pie a#link-solucion { margin-top: 35px; margin-bottom: 50px; margin-left: 15px; font-size: 13px; line-height: 32px; text-transform: uppercase; font-weight: bold; color: #ffffff; border-radius: 5px; background: url(../img/flecha_boton.png) no-repeat right 25px center #000000; padding: 11px 60px 11px 20px; }

form select { font-size: 18px; line-height: 36px; border: 1px solid #999999; border-radius: 5px; padding: 10px 10px; width: 100%; color: #bababa; }


/*===================================================================================*/
/*  Aviso legal / Política de cookies
/*===================================================================================*/

.contenido {    
    margin: 0 auto;    
    padding-bottom: 5em;
    width: 740px;  
    color: #000000;  
    font-size: 16px;
}
.contenido h1 {
    font-size: 36px;    
    text-transform: uppercase;
    font-weight: bold;
    line-height: 40px;
    margin: 40px 0;
}

.contenido h2 {
    font-size: 1.5em;       
    font-weight: bold;
    line-height: 1.45em;
    margin: 1em 0;
}

.contenido p {
    margin-bottom: 1em;
    line-height: 1.45em;
    font-size: 1em;
}

/*===================================================================================*/
/*  10 - Error 404
/*===================================================================================*/

.error404 .main h2 { color: #f10101; font-size: 30px; line-height: 36px; margin: 20px 0px 10px 0px; }
.error404 .main p { font-size: 16px; line-height: 22px; color: #666666; margin-top: 30px; }
.error404 .main p strong { font-weight: bold; color: #000000; }
.error404 .main .backto { width: 100%; margin-left: 0%; margin-right: 0%; }
.error404 .main .backto a { font-size: 16px; }

/*===================================================================================*/
/*  Responsive
/*===================================================================================*/


@media only screen and (min-width: 0px) and (max-width: 1000px) {
    header #logo-block { width: 100%; margin: 0px auto; padding: 30px 0px; }

    .home h2,
    .home p.intro { width: 96%; margin-left: 2%; margin-right: 2%; }
    
    #slider ul.slides li div.inner { width: 50%; }

    ol#breadcrumb { text-align: left; }
    
    .destacado div.right-img,
    .destacado div.right-img img,    
    .content,
    .destacado div.right-block,
    { width: 92%; margin-left: 4%; margin-right: 4%; }
    /*.prehome main .countries-back section #other-countries { width: 100%; }*/
    
    .remember_pass .main form input, 
    .descargas .main form input { margin-left: auto; margin-right: auto; }
    .remember_pass .main form input,
    .login .main form input,
    .descargas .main form input { width: 88%;  }
    
    .destacado div.right-block p,

    #home div#formulario,
    #home div#titular{width: 100%;}
    #home div#titular h1,
    #home div#titular p{width: 90%;}
    #home div#formulario div.campo{width: 90%; padding:0; }
    #home div#formulario div.importe{width:50%;}
    #home div#formulario div.texto-euros{width:40%; padding-top: 10px;}
    #home div#formulario div.boton{padding:20px 0;}
    footer div.blocks{width: 100%;}
 
}

@media only screen and (min-width: 800px) and (max-width: 1000px) {
    header #logo-block #logo { width: 31%; margin-left: 4%; }
    header #logo-block #header-right { width: 60%; margin-right: 4%; }
  
    footer div.blocks { width: 100%; margin-left: 0%; margin-right: 0%; }
    
    .content { width: 92%; margin-left: 4%; margin-right: 4%; text-align: center; }
 
    /*Sections*/    
    div.title-block div.text{ width: 100%;}
    div.title-block div.featured-select { width: 100%; margin-left: 0;}   

}

@media only screen and (min-width: 0px) and (max-width: 799px) {
    .content
    { width: 92%; margin-left: 4%; margin-right: 4%; text-align: center; }

    footer .blocks #social-menu-footer,
    footer .blocks #links-footer,    
    footer .blocks #erreka-copyright p,
    footer .blocks #secondary-menu-footer,
    footer .blocks .products-footer {text-align: center;}
	
    header #logo-block ul#secondary-menu,
    .prehome main > img { display: none; }
    
    .home h2,    
    div.sub-pie p,
    header #logo-block div#service-info,
    .backto,
    .share,
    .prehome main .countries-back section > ul,
    .contacto .main section#call-center div.right
    { width: 92%; margin-left: 4%; margin-right: 4%; text-align: center; }
    
  
    header #logo-block #logo { width: 100%; margin-left: 0%; margin-right: 0%; }
    
    .backto { margin-bottom: 20px; }
    
    header #logo-block #header-right { display: none; }
    header #menu-block #menu li { width: 100%; margin: 0px; padding: 10px 0px; }
    
    footer div.blocks { width: 100%; padding: 30px 0px;}
    footer div.products-footer { display: none; width: 100%; }
    footer div.products-footer p.title { display: none; }
    footer div.products-footer ul { display: none; }
    
    footer div#menu-footer { display: none; width: 100%; }
    
    footer div#secondary-menu-footer { width: 100%; }
    
    footer div#erreka-copyright { width: 100%; background-position: center top; }
    footer div#links-footer { width: 100%; padding-top: 15px; }
    footer div#social-menu-footer { width: 100%; text-align: center; }
 
    
    header #menu-block #menu li.selected { background: none; background-color: #492b2b; }
    header #logo-block div#service-info { margin-top: 30px; }
    
    div.sub-pie img { display: none; }
    
    footer div#secondary-menu-footer > a { margin-left: 0px; }
 
    /*Sections*/    
    div.title-block div.text{ width: 100%;}    
    div.title-block div.featured-select { width: 100%; margin-left: 0;}
}

@media only screen and (min-width: 0px) and (max-width: 600px) {
 
    .home h3 { width: 92%; margin-left: 4%; margin-right: 4%; }
     
    .destacado h1 { font-size: 30px; line-height: 40px; }
    .destacado p.bold,
    .destacado div.bold p { font-size: 20px; line-height: 24px; }
 
    /*Sections*/
    div.title-block div.featured-select p span.txt { width: 100%; padding-bottom: 2%; padding-right: 0%;}    
	div.title-block div.featured-select p span.drop { width:85%; margin-left: 0%;}	
	div.title-block div.featured-select p span.btn-drop { width:10%;}	
	div.title-block div.featured-select div.option {margin-left: 0%; margin-right: 10%; }

}

@media only screen and (min-width: 0px) and (max-width: 599px) {
        
    .home p.intro { font-size: 20px; line-height: 28px; }
    .destacado h1 { font-size: 24px; line-height: 32px; }
    
    .error404 .backto { display: block; }
    
    .remember_pass .main form a, .descargas .main form a { margin-top: 0px; margin-bottom: 20px; }
    
}