/* -- CSS
Blogs Media (http://blogsmedia.com) para Blogia
Autor: José Luis Antúnez (jl@blogsmedia.com) 
Fecha: Junio 2005 
Plantilla: Blogia 2.0 Conversation Side up (azul-v)
 -- */

body {	
color:#444;
font: small arial, helvetica, verdana, sans; 
margin:0; 
padding:0;
background: #eaefea url(../i/bd-blue.gif) repeat-x top left;
text-align:center;
line-height: 1.5em
}

p { margin:0 0 8px 0 }

/* --- Links ---------------------------------  */


a:link, a:visited { 
color:#03b;

}
a:hover { 
color:#08b; 
}
a img {
border-bottom:0;
}
a.powered {
background: url(../i/blogia-ic.gif) no-repeat 100% 50%;
padding-right: 20px;
}
#header a {
text-decoration: none;
color: #fff;
}


/* --- Header -------------------------------------------  */

#header {
height: 80px;
background: #687EBD
}
#header h1{
padding: 20px 0 5px 0;
margin:0;
font-size: 24px
}

/* --- Nav ---------------------------------  */

#nav {
margin: 0;
padding: 0;
list-style-type: none;
background: #5f75a0 url(../i/nav-blue.gif) repeat-x top left;
float: left;
}
.sm #nav {
float: right;
}
#nav li {
height: 29px;
float: left;
margin: 1px -1px 0 0;
border-right: 1px solid #687ea9;
border-left: 1px solid #687ea9;
}

#nav li a {
display: block;
padding: 0 15px;
font: 85%/260% tahoma, geneva, verdana, sans;
color: #ddd;
text-decoration: none

}

#nav li a:hover {
color: #fff;
background: #687ea9;
text-decoration: none;
}

/* --- Estructura ---------------------------------- */

#wrap {
position: relative;
width: 770px; 
margin: 0 auto; 
text-align: left;
background: url(../i/bg-up-border-blue.gif) top left;
}
.sm #wrap {
background: url(../i/bg-up-border-blue-sm.gif) top left;
}
#container {
background: url(../i/bg-ms-blue.gif) repeat-y top left;
float: left
}
.sm #container {
background: url(../i/bg-sm-blue.gif) repeat-y top left;
}

.ms #main, .sm #main {
width:488px;
padding:15px;	
border-top: 3px double #000;
background: #fff
}

#sidebar {

display:block;
width:250px;
font: 85%/150% "Lucida Grande", "Lucida Sans Unicode", verdana, arial, sans-serif;
background: #eaefea;
border-right: 1px solid #fff;
}
.sm #sidebar {
border-right: none;
border-left: 1px solid #fff;

}
.ms #main, .sm #sidebar {

float:left;
}
.ms #sidebar, .sm #main {
float:right;

}

.col, .side {
	padding: 5px 10px
}
.powextra {
	margin-top: 20px;
	padding: 10px;
	text-transform: uppercase
}
/* --- ul li's post / sidebar---------------------------------- */

#main ul li{

list-style: square;
margin: 0 0 .5em 1em;
padding-left: 5px;
}

#main ol li{

list-style: decimal;
margin-top: 0;
margin-bottom: 1em;
margin-left: 1em;
padding-left: 5px;
}
#main li{

font-family: "Trebuchet MS", verdana, sans
}

#sidebar ul {
margin: 0;
padding: 0;

}
#sidebar li {

list-style: none;
margin: 0;
border-bottom: 1px dotted #dfdfdf;
padding: .4em 0 .4em 0;
}
#sidebar li a {
text-decoration: none
}

.side li a { 
background:url(../i/post-more.gif) no-repeat left;
padding-left: 17px}

.col li a { 
background:url(../i/site-out.gif) no-repeat left; 
padding-left: 17px }

/* --- Encabezamientos ---------------------------------- */

h1, h2, h3  { 
color:#687EBD;
font-family: arial, verdana, sans;
line-height: 140%
}

h2 { 
font-size: 150%;
}
#sidebar h2 { 
margin-top: 0
}
#sidebar h3 { 
padding: 5px;
color: #fff;
font-size: 12px
}
.side h3 {

background: #718e0d url(../i/nav-green2.gif) repeat-x top left;
}
.col h3 {
background: #677da8 url(../i/nav-blue2.gif) repeat-x top left;


}
h4 { 
font-size: 110%;
}
#sidebar h4 { 
font-size: 100%;
}

/* --- Feedback ---------------------------------- */

.comentarios {
margin: 4em 0;
width: 485px; /* importante para cuadrar who-comment.gif de .textcomentario */
}
.comentario {
margin: 20px 0;

}

p.autorcomentario {

font-weight: bold;
background: url(../i/who-comment-top-blue.gif) no-repeat 0 25px;/* visto en http://markboulton.co.uk //  background exterior transparente por si #main no es blanco */
height: 70px;
margin: 0;
}

.textocomentario{
padding: 0 20px 20px;
background: url(../i/who-comment-blue.gif) no-repeat bottom left; /* width: 478px // background exterior transparente por si #main no es blanco */
}

p.infocomentario {

border-top: 1px dotted #ccc;
padding-top: 3px;
margin-bottom: 25px;
text-align: right
}

#anadircomentario{
background: #c3cca1;
padding: 8px;

}

.infoadicional {
margin: 2em 0;
border-top: 3px solid #687EBD;
padding-top: 5px;
}

/* --- dl about / bienvenida --------- */

.bienvenida, dl.about dd {
margin: 0 0 10px 0;
padding: 0 0 10px 0;
border-bottom: 1px dotted #ccc;
}
dl.about {
margin: 0;
padding: 0;
}
dl.about dt img {
border: 3px solid #cdc;
margin: 0px;
padding:0;
}
.ms dl.about dt img { /* --- para body class="ms" --------- */
float: right;
margin-left: 8px

}
.sm dl.about dt img { /* --- para body class="sm" --------- */
float: left;
margin-right: 8px
}

/* --- Footer -------------------------------- */

#footer
{
clear:both;
background: #677da8 url(../i/bf-az.gif) repeat-x top left;
padding: 15px 20px 5px;
color:#fff;
}


#footer a {
color:#eee;
}
#menu { 

float: right }


/* --- Varios -------------------------------- */

blockquote { 
color: #666; 
background: #f1f1f1 url(../i/blockquote.gif) no-repeat top right;
padding: 15px;
}
abbr, acronym, .help { 
cursor: help; 
background: #e3e3e3;
border-bottom: 1px dotted #ccc}

/* --- Formularios -------------------------------- */

form { 
margin: 0 0 10px;
padding: 0;
}

fieldset { 
border: 1px solid #777; 
}
legend { 
font: bold 100% georgia, times, serif;
color: #444; /* sino en IE sale azul puro */

}
input.button {
background:#768a36;  
color:#fff;  
border-color:#999 #666 #666 #999;
}
textarea { 
padding: 3px
}

/* --- Img's -------------------------------- */

img.right, img.center, img.left, img.centerenm, img.rightenm, img.leftenm { 
border: 3px double #687EBD;
} 
img.leftenm { 
margin: 2px 10px 10px 0; 
float:left; 
} 
img.rightenm { 
margin: 2px 0 10px 10px; 
float:right; 
} 
img.centerenm { display:block; margin: 0 auto 10px auto; text-align: center;
} 
img.left { 
margin: 2px 10px 10px 0; 
float:left; 
} 
img.right { 
margin: 2px 0 10px 10px;
float:right;

} 
img.center { 
display:block; 
margin: 0 auto 10px auto; 
text-align: center;
} 
