/**
* esilos de los documentos del blog
* @author José Edmundo Martínez Retama
* @package styles
*/

body{
	font-family:"trebuchet MS";
	background: #EEEEEE none repeat scroll 0 0;
}

a{
	text-decoration:none;
	color:#132399;
}

#main-container{
	margin:0 auto;
	width: 940px;
	overflow-y:auto;
}

#header{
	width: 940px;
	height:158px;
	background:none repeat scroll 0 0 #39414A;
	overflow: hidden;
}

#header h1{
	color:#FFFFFF;
	float:left;
	font-size:30px;
	padding-left:50px;
	padding-top:20px;
	text-shadow:2px 6px 12px #5DB0E6;
}

#blog-description{
	float:left;
	font-size:22px;
	font-weight:bold;
	color:#FFFFFF;
	padding-left:41px;
	padding-top:15px;
	text-shadow:4px 5px 1px #000000;
}

#change-language{
	background:url("img/block.png") repeat-x scroll 0 28px #067ED3;
	color:#333333;
	float:right;
	margin-right:11px;
	padding:10px 20px;
	text-shadow:-1px 1px 0 #FFFFFF;
	-moz-border-radius:28px 3px 37px 10px;
	-webkit-border-radius:28px 3px 37px 10px;
	-opera-border-radius:28px 3px 37px 10px;
	-o-border-radius:28px 3px 37px 10px;
	border-radius: 28px 3px 37px 10px;
}

#content{
	background: #FFFFFF none no-repeat scroll 0 0;
	width: 920px;
	overflow-y:auto;
	padding:10px;
}

#tabs-header{
	height:30px;
	width:100%;
}

#tabs-header ul li{
	float:left;
	background:none no-repeat scroll 0 0 #DDDDD0;
	height:30px;
	padding-left:10px;
	padding-right:10px;
}

#tabs-header ul li.selected{
	background:#CCCCCC none no-repeat scroll 0 0;
}

#tabs-header ul li.secuence{
	margin-left:7px;
}

#tabs-header ul li a{
	color:#888888;
}

#tabs-header ul li.selected a{
	color:#FFFFFF;
}

#tabs-content{
}

#demo, #code, #documentation{
	overflow:auto;
	padding:10px 3px 20px;
	background:#CCCCCC none no-repeat scroll 0 0;
}

#code,#documentation{
	display:none;
}

h2{
	color:#FFFFFF;
	font-size:24px;
	padding:10px;
	text-shadow:2px 2px 1px #000000;
}

h3{
	padding:5px;
}

#images-container{
	height:430px;
	width:860px;
	float:left;
}

#images-container #images-mask{
	height:430px;
	width:860px;
	overflow: hidden;
}

#images-container #images-mask img{
	width:280px;
	height:210px;
}

#flechas{
	float:left;
	height:430px;
	width:50px;
	overflow:hidden;
	background:none repeat scroll 0 0 #FFFFFF;
	border:1px solid #AAAAAA;
}

#separator{
	height:350px;
	width:50px;
}

#flechas .button{
	height:50px;
	height:40px;
	opacity:.8;
}

#flechas .button:hover{
	opacity:1;
}

.code{
	background:#FFFFFF none no-repeat scroll 0 0;
	padding: 15px;
	border:1px solid #000000;
}

.code li{
	list-style:circle inside none;
}

dl{
	padding:10px;
	background: #FFFFFF none repeat scroll 0 0;
}

dt{
	font-weight:bold;
	padding:10px;
}

dd{
	padding-left:30px;
	border:2px solid #000000;
	padding:10px;
}
#footer{
	height:30px;
	padding:10px;
	background: #BBB none repeat scroll 0 0;
}
#footer p{
	color:#FFFFFF;
	padding:5px;
	float:right;
	text-shadow: #000 1px 2px 2px;
}

#footer a{
	text-shadow: #FFF 1px 2px 2px;
	font-size: 18px;
	color:#000;
}