@charset "UTF-8";
/* reset ---------------------------------------------------------------------------------------------------- */
html,body,div,ul,ol,li,h1,h2,h3,h4,h5,form,fieldset,input,textarea,p { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset,img { border:0 }
address,caption,cite,code,dfn,em,th,var { font-style:normal; font-weight:normal }
ul {	list-style:none }
h1,h2,h3,h4,h5 { font-size:100%; font-weight:normal }

/* HTML ---------------------------------------------------------------------------------------------------- */
@font-face { font-family: Segoe UI; src: url('fonts/segoeui.ttf') }
@font-face { font-family: Segoe UI; font-weight:bold; src: url('fonts/segoeuib.ttf') }
@font-face { font-family: Corbel; src: url('fonts/corbel.ttf') }

body 		{ font-family:Segoe UI,sans-serif; background:#dce500 url(img/bg_body.png) center top }
h1 			{ font-size:32px; letter-spacing:-.05em; color:#444444 }
h2			{ font-size:23px; letter-spacing:-.02em; color:#000 }
h3			{ font-size:17px }
p			{ font-size:12px; line-height:22px }
strong		{ color:#ffe221 }
a			{ text-decoration:none; color:#06c }
a:hover		{ color:#000 }
input, select, textarea { font-family:'Segoe UI','Helvetica Neue', sans-serif; font-size:14px }
acronym { border-bottom:1px dotted #ccc; cursor:help }

/* CLEARFIX ----------------------------------------------------------------------------------------------------------------------------------- */
.clearfix:after			{ height:0; line-height:0; display:block; visibility:hidden; clear:both; content:"." }
.clearfix				{ display:inline-block }
html[xmlns] .clearfix	{ display:block }
* html .clearfix 		{ height:1% }

/* CONTENDORES PRINCIPALES ---------------------------------------------------------------------------------------------------- */
.wrap { width:940px; margin:0 auto }
#cap { height:350px; background:url(img/bg_cap.png) top repeat-x }
#arriba, #mensajemail, #menu a * { display:none }
#arriba { position:fixed; right:0; bottom:0; outline:none }
#logo { display:block; height:230px; padding-bottom:30px }

#menus { float:right; width:446px; margin:14px 35px 0 0 }
#menu { list-style:none; display:block }
#menu li { float:left }
#menu a, #menu a .hover { height:60px; width:220px; position:relative; display:block; outline:none; background:url(img/menu_sprite.png) 0 0 no-repeat; margin-right:20px }
#menu a.portfolio { background-position:0 0 }
#menu .resaltar a.portfolio:hover, #menu a.portfolio .hover { background-position:0 -60px; }
#menu a.servicios { background-position:-220px 0 }
#menu .resaltar a.servicios:hover, #menu a.servicios .hover { background-position:-220px -60px }
#menu a.sobremi { background-position:-440px 0  }
#menu .resaltar a.sobremi:hover, #menu a.sobremi .hover { background-position:-440px -60px }
#menu a.contacto { background-position:-660px 0; margin-right:0 }
#menu .resaltar a.contacto:hover, #menu a.contacto .hover { background-position:-660px -60px; margin-right:0 }

#cap .wrap { position:relative }
.laukatuempresa, .globocontacto { position:absolute; z-index:1000 }
.laukatuempresa { top:30px }
.globocontacto { right:0; top:200px }

#portfolio { background:#232323 url(img/bg_dark.png) top repeat-x; padding-top:40px; margin:0 }

#portfolio .proyecto		{ display:block; height:340px; position:relative; padding-bottom:40px; text-shadow: #000 1px 1px 1px }
#portfolio .proyecto .datos { position:absolute; z-index:500; top:0; left:0; background:url(img/fg_proyecto.png) left top no-repeat; display:block; width:275px; height:285px; padding:25px 25px 30px 645px }
#portfolio .proyecto h2		{ font-size:28px; line-height:28px; padding-bottom:10px; color:#cc0; font-family:Corbel,sans-serif }
#portfolio .proyecto p		{ color:#bcbcbc }
#portfolio .proyecto strong { font-weight:normal; color:#fff }
#portfolio .labels 				{ position:absolute; bottom:30px; font-size:12px }
#portfolio .labels li 			{ padding:0 22px; background-repeat:no-repeat; height:16px; margin-top:10px }
#portfolio .labels a 			{ color:#ddd; padding:1px 2px }
#portfolio .labels a:hover 		{ background-color:#ffe221; color:#000 }
#portfolio .labels .cliente 	{ background-image:url(img/labels.png); background-position:left top }
#portfolio .labels .url 		{ background-image:url(img/labels.png); background-position:left bottom }

#portfolio .versitio { display:block; position:absolute; top:0; left:0; width:620px; height:340px; z-index:1000 }
#portfolio .versitio img { display:none }
 
.ancla { display:block; clear:both; height:50px }
.asuperior { height:30px }

h2.amarillo { background:url(img/bg_titulosamarillo.png) 1px center no-repeat; height:40px; display:block; width:940px; text-align:center; padding:20px 0 }
h2.oscuro { background:url(img/bg_titulosioscuro.png) 1px center no-repeat; height:40px; display:block; width:940px; text-align:center; padding:20px 0 }
h2 span.quienesomos { text-indent:-5280px; display:block;  background:url(img/titulos.png) top center no-repeat; width:940px; height:40px; }

#quienesomos { padding-bottom:40px }
.fichaquien { background:url(img/bg_ficha.png) no-repeat left top; width:340px; height:155px; float:left; padding:20px 50px 30px 90px; display:block; position:relative }
.fichaquien .foto { position:absolute; left:18px; top:18px; display:block; width:56px }
.fichaquien .foto .blog { display:block; padding:3px 4px; outline:none }
.fichaquien h3 { font-size:18px; color:#010101; font-weight:bold; line-height:18px; padding-bottom:5px }
.fichaquien p {  line-height:18px; color:#555; padding-bottom:15px }
.fichaquien h4 { font-size:10px; color:#8e8e8e; font-weight:bold; padding-bottom:5px; text-transform:uppercase }
.fichaquien strong { color:#000; font-weight:normal }
.fichaquien .tags { font-size:11px; color:#222; line-height:16px }
.luis .gatoluislado { position:absolute; left:-38px; top:50px }
.abel { padding-right:30px }

#servicios, #peu { background:#232323 url(img/bg_dark.png) top repeat-x; padding-bottom:35px }
h2 span.servicios { text-indent:-5280px; display:block;  background:url(img/titulos.png) center center no-repeat; width:940px; height:40px; }
#servicios .globo { width:665px; height:244px; padding:18px 25px; background:url(img/bg_globoservicios.png) no-repeat left top }
#servicios .globo p { font-size:16px; line-height:24px; padding-bottom:10px }
#servicios .globo a { color:#000 }
#servicios .globo a:hover { background-color:#ffe221; color:#000 }
#servicios .globo strong { color:#000 }
#servicios .globo ul { font-size:12px; line-height:25px; color:#666 }
#servicios .globo ul li { padding-left:22px; background:url(img/bullet_llista.png) left center no-repeat }
#servicios .wrap { position:relative }
#servicios .gatosservicios { position:absolute; right:0; bottom:-5px }

h2 span.contacto { text-indent:-5280px; display:block;  background:url(img/titulos.png) bottom center no-repeat; width:940px; height:40px; }
#contacto { position:relative; padding-bottom:20px }
.datos_contacto { position:absolute; right:0; top:100px; background:url(img/gato_contacto.png) no-repeat; width:460px; height:302px }
.datos_contacto p { font-size:11px; line-height:17px; padding:12px 18px 0 284px; color:#555; text-align:center }
.datos_contacto strong {color:#000 }

#formulario_contacto { width:460px }
#formulario_contacto label	{ display:block; color:#222; font-size:12px; line-height:16px; height:18px; padding-bottom:3px }
#formulario_contacto input, #formulario_contacto textarea	{ border:0; width:440px; background:url(img/form.png) 0 0 no-repeat; color:#fff; margin-bottom:10px }
#formulario_contacto input.text { height:36px; line-height:35px; font-size:14px; color:#eee; padding:0 10px; margin:0 0 10px 0 }
#formulario_contacto textarea { height:280px; padding:10px; background-position:0 -36px; height:190px; }
#formulario_contacto input.boto { background-position:bottom left; width:172px; height:37px; text-indent:-5000px; outline:none; cursor:pointer }
#formulario_contacto #resultado { background-color:#222; padding:10px; font-size:12px; font-weight:bold; color:#fff; display:none }

#peu { padding:0; margin:0; border:0 }
#peu p { color:#999; font-size:11px; text-shadow: #000 1px 1px 0; background:url(img/gatopie.png) bottom left no-repeat; padding-left:48px; height:55px; line-height:55px }
