/*	Desc: Estilos de pantalla 
	Autor: Distridigital DDS Studio
	Fecha: 03/2009
= = = = = = = = = = = = = = = = = = = = = = = = = = = =  */


/*  - - - - - - - - - - -  RESET  - - - - - - - - - - - 
- - - */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, blockquote, address, th, td { margin: 0; padding :0; }
h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
ul { list-style-type : none; }
table { border-collapse : collapse; border-spacing : 0; }
caption, th { text-align : left; }
fieldset, img { border : 0; }
dt, address, caption, cite, code, dfn, b, th, var { font-style : normal; font-weight : normal; }
q:before, q:after { content :''; }

/*  - - - - - - - - - - -  ESTRUCTURA GENERAL - - - - - - - - - - - 
- - - */

html {
}

body {
background: #fff url(../images/2.png) repeat-x;
font-family: Lucida Grande, Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
font-style: normal;
}

#layout {
width: 850px;
padding: 0 10px 10px 10px;
margin: 0 auto;
}

#cabecera {
width: 850px;
padding: 20px 0 35px 0;
margin: 0 auto;
}

#contenido {
padding: 0 0 4px 0;
margin: 0 0 20px 0;
min-height: 320px;
}

#pie {
padding: 0 0 0 0;
margin: 40px 0 0 0;
}


/*  - - - - - - - - - - -  LOGO - - - - - - - - - - - */

#logo {
height: 90px;
width: 850px;
}

#logo h1 {
text-indent: -9999px;
font-size: 1%;
}

#logo a {
display:block;
width: 307px;
height: 63px;
background: transparent url(../images/6.png) no-repeat;
}

/*  - - - - - - - - - - -  ESTILOS GENERALES - - - - - - - - - - - 
- - - */

p {
color:#000;
font-size:100%;
line-height:1.5em;
}

a {
text-decoration: none;
outline: none;
color: #0066cc;
}

a:hover {
text-decoration: underline;
color: #e2001a;
}


h1 {
color: #e2001a;
font-size: 130%;
font-weight: bold;
margin-bottom: 20px;
}

h2 a {
color: #000;
}

h2 a:hover {
color: #e2001a;
font-decoration: none;
background: transparent url(../images/3.png) no-repeat scroll right ;
padding: 0 28px 0 0;
}

h4 {
color: #999;
font-weight: bold;
margin-bottom: 20px;
}

h4 a {
color: #999;
font-weight: bold;
}

/*  - - - - - - - - - - -  FLECHAS - - - - - - - - - - - */

a.flecha {
background: transparent url(../images/5.png) no-repeat scroll left  ;
padding: 0 0 0 26px;
}

a.flecha:hover {
background: transparent url(../images/3.png) no-repeat scroll left  ;
padding: 0 0 0 26px;
}

a.flecha_dcha {
background: transparent url(../images/5.png) no-repeat scroll right  ;
padding: 0 26px 0 0;
}

a.flecha_dcha:hover {
background: transparent url(../images/3.png) no-repeat scroll right  ;
padding: 0 26px 0 0 ;
}

a.flecha_volver {
background: transparent url(../images/26.png) no-repeat scroll left  ;
padding: 0 26px 0 26px ;
color: #666;
font-size: 90%;
}

a.flecha_volver:hover {
background: transparent url(../images/27.png) no-repeat scroll left  ;
padding: 0 26px 0 26px ;
color: #e2001a;
}


/*  - - - - - - -   PRESENTACION - - - - - - - - - - */

#presentacion {
padding: 0 0 50px 30px;
color: #999;
font-size: 140%;
font-weight: bold;
border-bottom: 1px solid #DDDDDD;
}

#presentacion ul {
padding-top: 10px;
}

#presentacion li {
font-size: 90%;
font-weight: normal;
line-height: 2.3em;
margin-left: 40px;
}

#presentacion li a {
font-size: 110%;
font-weight: bold;
color: #0066cc;
}

#presentacion ul a {
color: #0066cc;
}

#presentacion ul a:hover {
text-decoration: none;
outline: none;
color: #e2001a;
}




/*  - - - - - - - -  BLOQUES PORTADA - - - - - - - - - - - */

#portada_bloques {
min-height: 300px;
margin-bottom: 20px;
}


#portada_bloques p {
margin-bottom: 20px;
color:#666666;
font-size:90%;
line-height:1.5em;
}

#portada_bloques h4 a {
font-size:100%;
}

#portada_destacados {
float: left;
width: 240px;
border-right: 1px solid #DDDDDD;
margin: 0 40px 0 0;
padding-right: 20px;
min-height: 300px;
}

#portada_proyectos {
float: left;
width: 250px;
border-right: 1px solid #DDDDDD;
margin: 0 30px 0 0;
padding-right: 30px;
min-height: 300px;
}

#portada_etiquetas {
float: right;
width: 230px;
margin: 0;
padding: 0;
min-height: 300px;
}

/*  - - - - - - - -  PIE - - - - - - - - - - - */

#pie {
border-top: 1px solid #DDDDDD;
margin: 20px 0 60px 0;
padding: 0;
}

#portada_datos {
position: absolute;
}

#portada_datos a{
color: #666;
}

#portada_datos p {
color: #666;
font-size: 85%;
line-height: 1.4em;
padding: 0;
margin: 5px 0 0 0;
}

#portada_contactar {
float: right;
}

#portada_contactar p {
color: #FF0000;
font-size: 180%;
padding: 0;
margin: 5px 0 0 0;
}

#portada_contactar a {
color: #e2001a;
}

#portada_contactar a:hover {
color: #e2001a;
}

a.flecha_roja {
background: transparent url(../images/4.png) no-repeat scroll left ;
padding: 0 0 0 40px;
}

/*  - - - - - - - -  ARTICLE - - - - - - - - - - - */

#articulo {
margin: 0 0 30px 0;
padding: 0 0 60px 0;
min-height: 350px;
}

#articulo p {
line-height: 1.8em;
}

#imagen_muestra {
float: right;
width: 300px;
}

#articulo_texto {
width: 450px;
margin: 0 0 0 0;
}

#articulo_texto ul {
margin: 0 0 15px 15px;
}

#articulo_texto li {
line-height: 1.6em;
margin: 0 0 0 0;
padding: 0;
}



.web_externa {
color: #666;
font-size: 90%;
padding: 10px 0 0 0;
}

/*  - - - - - - - -  LISTADOS  - - - - - - - - - - - */

#trabajos_titulo {
margin: 0 0 30px 0;
}

#listado {
margin: 0;
padding: 0 0 50px 0;
width: 650px;
}

#trabajos_miniatura {
float: left;
}

#trabajos_lista {
margin: 0 0 0 200px;
}

#listado_proyectos {
margin: 0 0 0 55px;
padding: 0 0 50px 0;
width: 650px;
}

/*=FORMS CONTACTE
=== === === === === === === === === === */

.estatic {
margin-top: 20px;
}

.estatic form div {
background: #D8DFD8;
margin: 25px 0pt;
padding: 42px 42px 18px;
width: 476px;
}

.estatic form p {
margin-bottom: 10px;
color: #505050;
font-size: 80%;
float: right;
clear: right;
}

.estatic form p.txtinput input {
width: 250px;
margin-left: 15px;
}

.estatic form textarea {
width: 450px;
height: 100px;
}

#contacto_formulario {
float: right;
width: 330px;
background: #ededed;
padding: 15px;
}

#contacto_formulario h3 {
color: #000;
font-size: 90%;
font-weight: bold;
letter-spacing: 1px;
padding: 0 0 20px 0;
}

#contacto_enviado {
min-height: 500px;
padding: 1px 0;
margin: 1px 0;
}

/*= PORTADA ETIQUETAS === === === === === === === === === === */

#portada_etiquetas li {
line-height: 1.8em;
font-size: 90%;
color: #666;
}

#portada_etiquetas li a {
color: #666;
background: transparent url(../images/31.png) no-repeat scroll right  top ;
padding: 0 16px 0 0;
}

#portada_etiquetas li a:hover {
color: #e2001a;
background: transparent url(../images/32.png) no-repeat scroll right top  ;
padding: 0 16px 0 0;
}