
/* CSS Document */

body { background: #e5e5e5 url(../img/body-bg.gif) top left repeat-x; }

.inicio #container #nav ul li a#inicio, .blog #container #nav ul li a#blog, .acerca #container #nav ul li a#acerca, .servicios #container #nav ul li a#servicios, .portfolio #container #nav ul li a#portfolio, .contacto #container #nav ul li a#contacto {background: url(../img/menu-acurrent.jpg) top left repeat-x; -moz-border-radius:5px;-webkit-border-radius: 5px;}

#container #header { background: url(../img/header.jpg) top left no-repeat}

#container #nav { font-size:135%; /*background:url(../img/nav-bg.jpg) top left no-repeat;*/ float:left; }
#container #nav .round-left { background:url(../img/menu-bgleft.png) top left no-repeat; width:15px; height:48px; float:left}
#container #nav .round-right { background:url(../img/menu-bgright.png) top right no-repeat; width:15px; height:48px; float:left}
#container #nav ul { background: url(../img/menu-bg.jpg) top left repeat-x; margin:0; padding:18px 0 6px 0px; list-style:none; float:left; height:24px}
#container #nav ul li { padding: 0 5px; display:inline; padding-top:10px}
#container #nav ul li a { color: #FFF; text-decoration:none; padding:8px;}
#container #nav ul li a:hover { background: url(../img/menu-ahover.jpg) top left repeat-x; color: #60ab2d; -moz-border-radius:5px;-webkit-border-radius: 5px;}
#container #nav ul li a.current { background: url(../img/menu-acurrent.jpg) top left repeat-x; -moz-border-radius:5px;-webkit-border-radius: 5px;}

#container #ruta { font-size: 90%; padding-bottom:5px; /*margin-bottom:40px;*/ border-bottom: 1px solid #f8f8f8}

#maincontainer, #page { font-family:"Trebuchet MS", Arial; font-size:125%; color:#999; }

#maincontainer h1 { font-family:Futura, Helvetica, Arial, sans-serif; padding:0; font-size:375%; font-weight:normal; margin:22px 0 15px 0; color:#333}
#maincontainer h2 { background:url(../img/h2.gif) 0 50% no-repeat; font-family:Futura, Helvetica, Arial, sans-serif; padding:0 0 0 10px; font-size:250%; font-weight:normal;color:#333; margin-bottom:10px}
#maincontainer h3 { font-family: "Trebuchet MS", Arial; font-size:150%; font-weight:normal; }
#maincontainer h4 { font-family:Futura, Helvetica, Arial, sans-serif; font-size:150%; font-weight:normal; }

#presentacion.acercade p { font-size:100%; margin-bottom:10px; line-height:165%}

ul#socialmedia { margin:0 0 0 660px; height:24px; padding:17px 0 0 0}
ul#socialmedia li { display: block; float:left; margin:0}
ul#socialmedia li a { padding:17px 26px 18px 26px; margin:0}
ul#socialmedia li a.rss { background:url(../img/ico-rss.png) top left no-repeat;margin:0 12px 0 0 }
ul#socialmedia li a.rss:hover { background:url(../img/ico-rss.png) bottom left no-repeat; }
ul#socialmedia li a.twitter { background:url(../img/ico-twitter.png) top left no-repeat;margin:0 12px 0 0 }
ul#socialmedia li a.twitter:hover { background:url(../img/ico-twitter.png) bottom left no-repeat; }
ul#socialmedia li a.facebook { background:url(../img/ico-facebook.png) top left no-repeat; margin:0 12px 0 0}
ul#socialmedia li a.facebook:hover { background:url(../img/ico-facebook.png) bottom left no-repeat; }
ul#socialmedia li a.flickr { background:url(../img/ico-flickr.png) top left no-repeat; margin:0 12px 0 0}
ul#socialmedia li a.flickr:hover { background:url(../img/ico-flickr.png) bottom left no-repeat; }
ul#socialmedia li a.linkedin { background:url(../img/ico-linkedin.png) top left no-repeat; margin:0 12px 0 0}
ul#socialmedia li a.linkedin:hover { background:url(../img/ico-linkedin.png) bottom left no-repeat; }

.tweets { background: #bee3f6 url(../img/bg-twitter.jpg) top right no-repeat;  color:#266d9b; font-size:90%; line-height:165%; padding:15px 15px 5px 15px; min-height:120px}
.tweets p { width: 180px}

#portada-portfolio p, #portada-servicios p, #portada-blog p{ font-size:90%; margin-bottom:15px; line-height:165%}
#portada-portfolio img, #portada-servicios img, #portada-blog img { margin-bottom:15px;}

#content.perso h2 { background:url(../img/h2-acerca.gif) 0 50% no-repeat; font-size:200%; font-weight:normal; margin-bottom:20px; color:#333; font-family:Futura, Helvetica, Arial, sans-serif; padding-left:10px}
#maincontainer a, #page a { color: #60ab2d;  text-decoration:none}

#maincontainer .button { display: inline-block; width: 300px; height: 50px; background : -webkit-gradient(linear, left top, left bottom, color-stop(0.25, rgb(255,71,71)), color-stop(1, rgb(200,17,17))); background : -moz-linear-gradient(center top, rgb(255,71,71) 25%, rgb(200,17,17) 100%); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;	padding: 1px; cursor: pointer; text-align: center; margin-top:20px}
#maincontainer .button:hover {	background : -webkit-gradient(linear, left top, left bottom, color-stop(0.25, rgb(255,105,105)), color-stop(1, rgb(213,13,13))); background : -moz-linear-gradient(center top, rgb(255,105,105) 25%, rgb(213,13,13) 100%);}
#maincontainer .button-inner { display: inline-block; width: 310px; padding-top: 4%; font-size: 25px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border-top: 1px solid rgba(255, 255, 255, 0.6); color: #fff;		text-shadow: 0px 1px 0px #6c0909;}

#maincontainer #leftside a:hover { text-decoration:underline}
#maincontainer #leftside p.metadescription { color:#999; line-height:12px; font-size:90%}
#maincontainer ul { list-style:none;}
#maincontainer #leftside ul li, #maincontainer #centerside ul li { margin-bottom:5px; background: url(../img/li.jpg) 0% 50% no-repeat; padding-left:20px}

#rightside #acerca {margin-top:20px; width:390px}
#rightside #acerca h2 { padding-left:130px; font-size:220%; font-weight:normal; background:url(../img/h2-acerca.gif) 120px 50% no-repeat; margin-bottom:10px; color:#FFF}
#rightside #acerca img {margin-right:20px; margin-bottom:10px; float:left}
#rightside #acerca p { font-size:125%; font-family:"Trebuchet MS", Arial; line-height:20px}

#rightside #flickr { padding:25px; background:#e5e5e5}

.work {padding:5px; width:290px; font-size:90%; margin-bottom:20px; float:left;}
.work ul, .workcenter ul { list-style:none; margin: 5px;}
.workcenter { padding:5px; width:290px; font-size:90%; margin-bottom:20px; float:left; margin:0 15px}
.blackstrong { color:#666; font-weight:bold}
.textogris { color:#333}
.cursiva { font-style:italic}


/* --- BLOG ---*/


#page a:hover {color:#78b000; text-decoration:underline;}
#page a:visited {color: #9900CC; text-decoration:none;}

#page h2 { font-family:Futura, Helvetica, Arial, sans-serif; font-size:250%; font-weight:normal;color:#333; margin:20px 0}
#page h3 { font-family: "Trebuchet MS", Arial; font-size:150%; font-weight:normal;margin:10px 0 }


/* --- CONTENT ---*/
#content {}
#content #ruta { font-family:Arial, Helvetica, sans-serif; font-size: 90%; color:#999; margin-bottom:20px}

#content p { margin-bottom:20px}
	#content #post-datos { background:#f5f5f5; padding:10px; font-size:80%; color:#999; margin:10px 0 20px 0; height:55px; font-family:Verdana, Arial, Helvetica, sans-serif;}
	#content img { padding:3px; border: 1px solid #CCC; margin-right:15px}
	#content.perso img { padding:0 0 3px 3px; border: none; margin-right:0}
	#content #post-datos .avatar { float:left}
	#content #post-datos #postmetadata .comentarios a { font-size:18px; font-weight:bold; color:#78b000}
	#content #post-datos #postmetadata .tags a {}
	#content #post-datos #postmetadata a:hover { text-decoration:none; color:#78b000;}
	#content #post-datos #postmetadata { float:left; padding-top:10px; }
	#content #post-datos #postmetadata ul, #content .postmetadata ul li {display: inline; list-style-type: none; list-style-image: none;}
	#content .entry { line-height: 1.4em;}
	#content .entry img, #content .entry img a { border:none}
	#content .entry p { font-size: 1.05em;}
	#content #separador { border-top: 1px solid #CCC; padding-bottom:25px; margin-top:10px}
	
	#content h2.pagetitle {font-size: 34px; font-weight:normal; padding-left:0; margin-left:0; text-align:left; color:#333}
	#content h2 a {color: #333; text-decoration:none}

	#content ol.commentlist { padding: 0; margin:0; text-align: justify;}
	#content ol.commentlist li .avatar { border: 1px solid #eee; padding: 2px; background: #fff;}
	#content ol.commentlist li .avatar-48 { width: 52px}

	#content #respond { width:576px;}
	#content #commentform { margin: 5px 10px 0 0; background: #c2e5f4 url(images/commentform-bg.jpg) top right no-repeat; text-align:left; padding:15px;}
	#content #commentform input { padding: 2px; margin: 5px 5px 1px 0; }
	#content #commentform textarea { width: 100%; padding: 2px;}
	#content #commentform #submit { margin: 0;}
	
	.aviso { background:#FFFFCC; padding:15px; margin:10px 0}
	



/* --- SIDEBAR ---*/
#sidebar h3 { background:url(../img/h2.gif) 0 50% no-repeat; font-size:250%; font-weight:normal; margin-bottom:20px; color:#333; font-family:Futura, Helvetica, Arial, sans-serif; padding-left:10px}

	#sidebar #ultimos-comentarios,#sidebar #nube-de-tags,#sidebar #adsense,#sidebar #blogs-amigos,#sidebar #ranking { margin:0 0 20px 0; width:300px}
	#sidebar  #twitter { padding:5px; border:1px solid #e5e5e5; width:290px; margin-top:25px; margin-left:0; }


	#sidebar #searchform { width:270px; background: url(../img/menu-bg.jpg) top left repeat-x; padding:15px}

	#sidebar #ultimos-comentarios { text-align: left; padding:10px 0 10px 0; margin-top:20px}
	#sidebar #ultimos-comentarios ul { list-style:none; line-height:14px;}
	#sidebar #ultimos-comentarios ul li { list-style-type:none; margin-bottom:10px}
	#sidebar #ultimos-comentarios ul li a{ text-decoration:none}
	#sidebar #ultimos-comentarios ul li a:hover { text-decoration:underline}
	#sidebar #ultimos-comentarios .comentariocorto { font-style:italic; color:#999}

	#sidebar #nube-de-tags { text-align:justify; padding:10px 0 10px 0;}

	#sidebar #tag_update { display: block; border-left: 1px solid #373737; border-right: 1px solid #373737; border-bottom: 1px solid #373737; position:absolute;z-index:1;}
	#sidebar #tag_update ul {margin: 0;padding: 0;list-style: none;}
	#sidebar #tag_update li{display:block; clear:both;}
	#sidebar #tag_update a { width:134px; display: block; padding: .2em .3em;text-decoration: none; color: #fff;background-color: #1B1B1C; text-align: left;}
	#sidebar #tag_update a:hover{ color: #fff; background-color: #373737; background-image: none;}

	#sidebar #ranking { padding: 10px;}
	#sidebar #ranking div{ text-align:center; padding: 5px 0;}


	
/* ---  FOOTER ---*/

#footer {background:#333; color:#CCC; font-size:110%; padding:15px 25px}
#footer img { float:left; margin-right:20px;}
#footer p { padding-top: 50px}
#footer a { text-decoration:none; color:#CCC}
#footer a:hover { text-decoration:underline;}


.thread-alt { background-color: #f8f8f8;}
.thread-even { background-color: white;}
.depth-1 { border: 1px solid #ddd;}

.even, .alt { border-left: 1px solid #ddd;}
	
#page #wp-calendar caption,#page cite {text-decoration: none;}

.sticky {background: #f7f7f7;padding: 0 10px 10px;}
.sticky h2 {padding-top: 10px;}

.commentlist li ul li { font-size: 1em;}

.commentlist li { font-weight: bold;}

.commentlist cite, .commentlist cite a { font-weight: bold; font-style: normal; font-size: 1.1em;}
.commentlist p { font-weight: normal; line-height: 1.5em; text-transform: none;}
.commentmetadata { font-weight: normal;}

.nocomments, blockquote, strike { color: #777;}

code {	font: 1.1em 'Courier New', Courier, Fixed;}

acronym, abbr, span.caps {font-size: 0.9em; letter-spacing: .07em;}
#wp-calendar #prev a, #wp-calendar #next a { font-size: 9pt;}
#wp-calendar a { text-decoration: none;}
#wp-calendar caption { font: bold 1.3em 'Lucida Grande', Verdana, Arial, Sans-Serif; text-align: center;}
#wp-calendar th { font-style: normal; text-transform: capitalize;}
/* End Typography & Colors */



/* Begin Structure */
.widecolumn { padding: 10px 0 20px 0; margin: 5px 0 0 150px;}
.post { margin: 0 0 40px; text-align: justify;}
.widecolumn .post { margin: 0;}
.widecolumn .smallattachment { text-align: center; float: left; width: 128px; margin: 5px 5px 5px 0px;}
.widecolumn .attachment { text-align: center;	margin: 5px 0px;}
.clear { clear: both;}
/* End Structure */




/* Begin Images */
p img { padding: 0; max-width: 100%;}

/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */

img.centered { display: block; margin-left: auto; margin-right: auto;}
img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline;}
img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline;}
.alignright { float: right; }
.alignleft { float: left;}
/* End Images */



/* Begin Lists

	Special stylized non-IE bullets
	Do not work in Internet Explorer, which merely default to normal bullets. */

html>body .entry ul {
	margin-left: 0px;
	padding: 0 0 0 30px;
	list-style: none;
	padding-left: 10px;
	text-indent: -10px;
	}

html>body .entry li {
	margin: 7px 0 8px 10px;
	}

.entry ul li:before, #sidebar ul ul li:before {
	content: "\00BB \0020";
	}

.entry ol {
	padding: 0 0 0 35px;
	margin: 0;
	}

.entry ol li {
	margin: 0;
	padding: 0;
	}

ol li, #sidebar ul ol li {
	list-style: decimal outside;
	}

/* End Entry Lists */



/* Begin Form Elements */

.entry form { /* This is mainly for password protected posts, makes them look better. */
	text-align:center;
	}

select {
	width: 130px;
	}

#respond:after {
		content: "."; 
	    display: block; 
	    height: 0; 
	    clear: both; 
	    visibility: hidden;
	}
/* End Form Elements */



/* Begin Comments*/
.alt {
	margin: 0;
	padding: 10px;
	}

.commentlist li {
	margin: 15px 0 10px;
	padding: 5px 5px 10px 10px;
	list-style: none;

	}
.commentlist li ul li { 
	margin-right: -5px;
	margin-left: 10px;
}

.commentlist p {
	margin: 10px 5px 10px 0;
}
.children { padding: 0; }
.nocomments { text-align: center; margin: 0; padding: 0;}
.commentmetadata { margin: 0; display: block;}
/* End Comments */



/* Begin Sidebar */

#sidebar form { margin: 0;}

/* End Sidebar */

/* Begin Calendar */
#wp-calendar { empty-cells: show; margin: 10px auto 0; width: 155px;}
#wp-calendar #next a { padding-right: 10px; text-align: right;}
#wp-calendar #prev a { padding-left: 10px;text-align: left;}
#wp-calendar a { display: block;}
#wp-calendar caption { text-align: center; width: 100%;}
#wp-calendar td { padding: 3px 0; text-align: center;}
#wp-calendar td.pad:hover { /* Doesn't work in IE */ background-color: #fff; }
/* End Calendar */



/* Begin Various Tags & Classes */
acronym, abbr, span.caps { 	cursor: help;}

acronym, abbr { border-bottom: 1px dashed #999;}

blockquote { margin: 15px 30px 0 10px; padding-left: 20px; border-left: 5px solid #ddd; font-style:italic}
blockquote cite { margin: 5px 0 0; display: block;}

.center { text-align: center;}
.hidden { display: none;}
.screen-reader-text { position: absolute; left: -1000em;}
a img {	border: none;}
.navigation { text-align: center; margin-top: 10px; margin-bottom: 0; height:20px }

/* End Various Tags & Classes*/

/* Captions */
.aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto;}
.wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px;}
.wp-caption img { margin: 0; padding: 0; border: 0 none;}
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px;	padding: 0 4px 5px;	margin: 0;}
/* End captions */

.sociable { padding:10px; background: #f5f5f5; margin-top:10px}
.alinearcentro { text-align:center}
.separador {border-top: 1px solid #f2f2f2; margin:10px 0; height:5px}