/* LAYOUT */
/* ----------------------------------------- */


/* These rather presentational classes are generated by WordPress, so it's useful to have some styles for them. Edit as you see fit. More info: http://codex.wordpress.org/CSS */
.aligncenter { display:block; margin:0 auto }
.alignleft { float:left }
.alignright { float:right }
.wp-caption { border:1px solid #666; text-align:center; background:#ccc; padding:10px; margin:10px }

/* You might find the following useful */
br.dirtyLittleTrick { clear:both; display:block; height:1px; margin:-1px 0 0 0 } /* Use this br class to clear your floated columns */
div { position:relative } /* This will save you having to declare each div's position as 'relative' and allows you to absolutely position elements inside them */
li#theme-switcher { background:#fff; border:10px solid red; padding:20px; position:fixed; top:0; right:0 } /* Use this if you have the Theme Switcher Reloaded plugin (http://themebot.com/webmaster-tools/1-wordpress-theme-switcher-reloaded) installed and want to make it nice and obvious */


*{ margin: 0; padding: 0;}

html{ overflow:scroll;}
html, body {
height: 100%;
}

body{ 
font-size: 62.5%;
font-family: Comic Sans MS, sans-serif;
color:#FFFFFF;
background: top center repeat-x #330000;
}
 

ul{ list-style: none; }
ol{ list-style: decimal inside; }
a{ outline: none; text-decoration:none; }
a img{ border: none; }
img{ vertical-align: middle; }
table{ border-collapse: collapse; } 

/*

	UTILES

*/

.floatLeft{ float:left; }
.floatRight{ float:right; }
.clear{ clear: both; }
.button								{ border: 1px solid white; background: white; padding: 3px 8px; 
									  -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #990033; }
.button:hover						{ background: #990033; color: white; } 





/*

	ESTRUCTURA
	
*/
	
#page-wrap{
width:800px;
margin:0 auto -400px;

min-height: 100%;
height: auto !important;
height: 100%;

}	

#push{ height: 100px; }

#main-col{  float:left; margin-right: 15px; margin-top:50px; display:inline; }
#bigSidebar{ width:440px; float:left;  margin-top:7px}

/*
	TIPOGRAFIAS
*/
p, li								{ font-size: 1.2em; line-height: 1.2em; margin: 0 0 10px 0; }
p#intro-paragraph					{ font-family: Georgia, serif; font-size: 2.0em; font-style: italic; line-height: 1.4em; 
									  margin-top: 5px; 
									  color: #660000; }
p#intro-paragraph span				{ font-size: 2.4em; font-weight: bold; }
p#intro-paragraph em				{ color: #660000; }
a									{ color: white; }
a:hover								{ background: white; color: #660000; }
h1									{ font-size: 3.6em; font-family: Georgia, serif; font-weight: normal; }
h2									{ font-size: 2.8em; font-family: Georgia, serif; font-weight: normal; }
h3									{ font-size: 2.6em; font-family: Georgia, serif; font-weight: normal; margin: 0 0 10px 0; }
h4									{ color: white; font-size: 2.0em; margin-bottom: 15px; }
.post h4							{ font-size: 1.8em; font-family: Arial, Helvetica, sans-serif; font-weight: normal; margin: 0 0 10px 0;
									  color: #660000; }


									  
#texto-introduccion{
width: 500px;
font-family: Georgia, serif; font-size: 1.9em; font-style: italic; 

color: #660000;
margin-bottom: 50px;
}

#texto-introduccion em{
font-family: Georgia, serif; font-size: 2.9em; font-style: italic;  
									  
									  color: #660000;


}
									  

#BlogsAmigos p{
font-size: 2.3em;
color:#990033;

}

#BlogsAmigos{
position:absolute;
left:10px;
top:280px;
font-size: 1.3em;
font-weight: normal;}
#BlogsAmigos a{margin-left:15px; line-height: 1.4em;}	

#Unete{
position:absolute;
top:20px;
right:10px;
}

#Unete:hover{
background:none;

}
									  
/*

	HEADER
	
*/

#logo{
width: 200px; height: 249px;
background: url(/imagenes/logo.png) top left no-repeat; text-indent:-9999px;
margin: 0 10px 8px 0; float: right;
margin-right:150px;
}

#top-bar	{ padding: 20px 0 0 0; }
#top-bar p	{ color:#990033; width: 300px; float:right; }
form#searchform	{ margin:0 0 10px 0; margin-left:30px; float:left;}

#menu-bar{ margin-top:-100px; padding-top: 2px; margin-bottom:20px;_margin-bottom:-20px;
#margin-bottom:-20px;}
ul#main-nav{ width: 360px; #width: 500px; _width:500px; float: left; margin:2px 0 0 0; font-weight:bold;}
ul#extra-nav{ width: 360px; #width: 500px; _width:500px; float: right; text-align: right; margin:2px 0 0 0; }
ul#main-nav li, ul#extra-nav li{display:inline;}
ul#main-nav li a, ul#extra-nav li a{ color:#990033; font-size:2.2em; #font-size:large; _font-size:large; padding: 3px 0px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

ul#main-nav li a:hover, ul#extra-nav li a:hover{color: white; background:#660000;}

#menu{

right:0;
padding-top: 2px; margin-bottom:20px;
}


/*


ENTRADAS DEL BLOG


*/

.post 								{ margin: 0 0 45px 0;}



.datebox							{ width: 56px; height: 60px; float: left; padding: 0 5px 5px 5px; background: url(/images/calendario.png) top center; text-align: center;
									  margin: 0 10px 0 0; }
.irComentarios						{ padding: 0 0 0 0; text-align: center;
									      font-size: 1.5em; font-weight: bold; 
									  }	
	
#textoEntrada						{font-size: 1.1em; margin:auto auto;}


	
.flechaResto						{ width: 57px; height: 43px; float: left; padding: 0 5px 5px 5px; background: url(/images/flechaIr.png) top center; text-align: center;
									  margin: 0 10px 0 0; margin-bottom:5px;}
.day								{ font-size: 2.4em; font-weight: bold; color: #003366; margin: 0; margin-top:10px; font-family: Georgia, serif; text-align:center; }
.month								{ font-size: 0.9em; margin: 0; margin-top:7px; color: #003366;}
.year								{ font-size: 1.6em; font-weight: bold; color: #003366; margin: 0; }
ol.commentlist						{ list-style: none; }
.comment-bubble						{ background: #990000; color: white; padding: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
ol.commentlist li p					{ font-size: 1.0em; }
.gravatar							{ margin-top: 3px; padding: 2px; height: 40px; }




/*

SIDEBAR


*/


#rss{
width: 101px; height: 63px; background: url(/images/rss.png) top left no-repeat;

}

#rss:hover{
width: 101px; height: 63px; background: url(/images/rssover.png) top left no-repeat;

}



#abajoFoto{
margin-top:-70px; width: 762px; height: 289px; background: url(/imagenes/abajoFoto.png) top left no-repeat;
z-index:1;
}
#dentroFoto{
width: 762px; height: 289px;
margin-top:-256px;
margin-left:39px;
z-index:2;
} 

#right{
float:right;
}

#arribaFoto{
 width: 762px; height: 289px; background: url(/imagenes/arribaFoto.png) top left no-repeat;
margin-top:-323px;


z-index:3;

}
ul.ppt {
	position: relative;
}

.ppt li {
	list-style-type: none;
	position: absolute;
	top: 0;
	left: 0;
}

.ppt img {
	
	background-color: #ececec;
	width: 587px;
	height: 228px;
	
	}

#enlaces-inside h2{
font-size: 1.9em;
line-height: 1.5em;
color:#003366;
font-weight:bold;
}


#separacion{


width: 752px; height: 145px;
background: url(/imagenes/separacion.png) top center no-repeat;

}


 

/*
	FOOTER

*/

#footer	{
height: 136px;
width: 800px; 
background: url(/imagenes/pie.png);
}
#footer-inside{width: 700px; padding-top:40px; margin-left:50px; color: #660000; font-family: Arial, serif; font-size: 1.1em;}
#rojo{
color:#990033;
}



#separacionie{
height:50px;
}





body{background-color:#330000;color:white;padding-top:20px;}
	
/* These hieghts and widths should be edited to your images */	
ul#pikame{
	padding-left:0;
	width:450px;
	margin:0 auto;}
.pika_main{
	width:500px;
	padding-right:20px;
	margin:0 auto;}
#pikame li{
	margin:5px;
	float: left;
	border:2px solid #222;}

	#contenedor{
	margin-left:-200px;
	}
	
	#volver{
	text-align:center;
	}
	
/* thats all you NEED to edit. But continue if you'd like. */
ul#pikame li img{position:relative;cursor:pointer;}
.pika_main img{border:5px solid #222;}
.pika_main{position: relative;margin:0 auto;}
.pikachoose li{float:left;position:relative;overflow:hidden;list-style:none;}
.pika_play{position:absolute;top:10px;right:20px;z-index:1;}
.pika_play a{position:relative;margin-left:auto;cursor:pointer;}
.pika_play img{border:none !important;}
.pika_caption{width:100%;height:30px;text-align:center;}
.pika_navigation a{font-size: 12px;color:white;text-decoration: none;}
.pika_navigation a:hover{text-decoration: underline;}
.pika_navigation{padding-top:10px;clear:both;text-align:center;}