* { padding: 0; margin: 0; }		

body{ background: #000 url("bg.png"); text-align: center;}
html, body { height: 100%; }
#presentacion, #trabajos, #proyectos, #acerca { min-height: 100%; width: 100%; margin: 0 auto; }
* html #presentacion, * html #trabajos, * html #proyectos, * html #acerca { height: 100%; }			

h1, h2, h3 {
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 200;
	color: #FFF;
	font-size: 2.5em;
}

#navigation { position: fixed; top:0px; margin: 0 auto; width:100%;}
#navigation ul{ list-style: none;  width:528px; margin: 0 auto; }
#navigation ul li{ display: inline; }
#navigation ul li a{ 
	font: .70em Tahoma; 
	letter-spacing:1px; 
	text-decoration: none; 
	display: block; 
	width: 110px;
	float: left; 
	line-height:28px; 
	margin: 0px 10px 0px 10px; 
	text-align: center; 
	background-color: #EEE; 
	color: #444;
	border-left: 1px solid #AAA;
	border-right: 1px solid #AAA;
	border-bottom: 1px solid #AAA;
	-moz-border-radius: 0px 0px 7px 7px;  /* gecko */ 
	-webkit-border-top-right-radius: 0px; /* webkit */ 
	-webkit-border-top-left-radius: 0px; /* webkit */ 
	-webkit-border-bottom-right-radius: 7px; /* webkit */ 
	-webkit-border-bottom-left-radius: 7px; /* webkit */ 
	border-radius: .0px .0px .7px .7px; /* w3 */
	text-shadow: 1px 1px 1px #AAA;
}
#navigation ul li a:hover{ color: #FFF; background-color: #555; }
/*#navigation ul li a#nav_presentacion{ background: #000 url("") no-repeat; }
#navigation ul li a#nav_trabajos{ background: #000 url("") no-repeat; }
#navigation ul li a#nav_proyectos{ background: #000 url("") no-repeat; }
#navigation ul li a#nav_acercade{ background: #000 url("") no-repeat; }*/
#navigation ul li a.active{ font: 0.85em Tahoma; letter-spacing:1px; line-height: 40px; background-color: #888; color: #FFF;}
#navigation ul li a span{  }

#container{ margin: 0px auto; display: block; height: 380px; width: 800px; background: url("content.png") top center no-repeat;}
#container h1 a{ display:block; width: 800px; height: 150px; }
#container h2,h3,h4,h5{ display: block;}
#container h2 { height: 65px; }
#container h3 { margin-top: 3px; height: 45px; }
#container h4 { margin-top: 3px; height: 40px; }
#container h5 { margin-top: 37px; height: 30px; }
#container h1 span,h2 span,h3 span,h4 span,h5 span{ display: none; }

#social{ width: 425px; margin: 10px auto; }
#social ul{ margin: 0 auto; list-style: none; }
#social ul li{ display: inline; }
#social ul li a{ display: block; float: left; width: 64px; height:64px; margin: 0px 10px 0px 10px; }
#social ul li a.rss{ background: #000 url("images/rss.png") no-repeat; }
#social ul li a.twitter{ background: #000 url("images/twitter.png") no-repeat; }
#social ul li a.facebook{ background: #000 url("images/facebook.png") no-repeat; }
#social ul li a.flickr{ background: #000 url("images/flickr.png") no-repeat; }
#social ul li a.delicious{ background: #000 url("images/delicious.png") no-repeat; }
#social ul li a span{ display: none; }

#presentacion { padding-top: 40px; }
#trabajos { padding-top: 40px; }
#proyectos { padding-top: 40px; }
#acerca{ padding-top: 40px; }

/*=== Slider ===*/

.stepcarousel{
	margin: 0 auto;
	width: 900px;
}
.stepcarousel #galery_trabajos,.stepcarousel #galery_proyectos{
	margin: 0 auto;
}

.stepcarousel .belt_proyectos,.stepcarousel .belt_trabajos{
	margin: 0 auto;
}
.stepcarousel a.navigation{
	font: normal 35px Georgia;
	padding: 0px 10px 5px 10px;
	line-height: 40px;
	background-color: #f6f5ed;
	color: #000;
	margin-top: 170px;
	text-shadow: 1px 1px 1px #999;
	-moz-border-radius: 7px 7px 7px 7px;  /* gecko */ 
	-webkit-border-top-right-radius: 7px; /* webkit */ 
	-webkit-border-top-left-radius: 7px; /* webkit */ 
	-webkit-border-bottom-right-radius: 7px; /* webkit */ 
	-webkit-border-bottom-left-radius: 7px; /* webkit */ 
	border-radius: .7px .7px .7px .7px; /* w3 */
}
.stepcarousel a.navigation:hover{
	cursor: hand;
}
.stepcarousel a.next{ float: right; }
.stepcarousel a.prev{ float: left; }

.stepcarousel .trabajo,.stepcarousel .proyecto{
	margin: 15px; /*margin around each panel*/
	width: 770px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */	
	text-align: center;
	height: 400px;
}
#trabajos h1,#proyectos h1, #acerca h1{
	font: italic 35px Georgia;
	font-weight: normal;
	letter-spacing: 1px;
}
.stepcarousel .trabajo h2,.stepcarousel .proyecto h2{
	text-transform: uppercase;
	font-size: 1.4em;
	letter-spacing: 1px;
	color: #9AC1FF;
	text-align: left;
	margin-left: 25px;
	padding-bottom:5px;
}
.stepcarousel .trabajo p,.stepcarousel .proyecto p{
	color: #FFF;
	font: 1em Georgia;
	padding: 4px 20px 4px 20px;
	text-align: left;
}
.stepcarousel .trabajo p em,.stepcarousel .proyecto p em{
	border-bottom: 1px dashed #FFF;
}
.stepcarousel .trabajo a,.stepcarousel .proyecto a{ color: #BBB; border-bottom: 1px solid dotted;}
.stepcarousel .trabajo a:hover,.stepcarousel .proyecto a:hover{ color: #FFF; }
.stepcarousel .trabajo a:visited,.stepcarousel .proyecto a:visited{ color: #CCC; }

.stepcarousel .snap{
	background-color: #f6f5ed;
	padding: 3px;
	-moz-border-radius: 7px 7px 7px 7px;  /* gecko */ 
	-webkit-border-top-right-radius: 7px; /* webkit */ 
	-webkit-border-top-left-radius: 7px; /* webkit */ 
	-webkit-border-bottom-right-radius: 7px; /* webkit */ 
	-webkit-border-bottom-left-radius: 7px; /* webkit */ 
	border-radius: .7px .7px .7px .7px; /* w3 */
}
.stepcarousel .snap img{ margin-top: 5px; border: 1px solid #333; }
.stepcarousel .snap p.code{ 
	font-family: 'Lucida Console', Monaco, monospace;
	font-size: 0.9em;
	text-align: center;
	background-color: #f6f5ed;
	color: #333;	
}

.stepcarousel .snap a{ color: #666; border-bottom: 1px solid dotted; text-decoration: none;}
.stepcarousel .snap a:hover{ color: #000; }
.stepcarousel .snap a:visited{ color: #444; }

#acerca{ width: 795px; margin: 0auto; text-align: center; }
#acerca h1{ margin-bottom: 20px; }
#acerca p{ 
	color: #FFF;
	font: 1em Georgia;
	padding: 4px 20px 4px 20px;
	text-align: justify;
	line-height: 20px;
}
#acerca img.thumb{ float: right; margin: 4px 0px 10px 10px; padding: 2px; border:1px solid #FFF; width: 200px; }
abbr, acronym{ border-bottom: 1px dashed #888; }
#acerca p.contact{ margin-left: 20px; }
#acerca p.contact span{ font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; color: #9AC1FF;}

.publi { margin: 20px; }
.publi p{ color: #FFF; font-size: 10px; font-family:Tahoma;}
.publi a,.publi a:active,.publi a:hover,.publi a:visited{ color: #FFF; }