* {
	margin: 0;
	border: 0px;
	padding: 0;
	}
body {
	background-color: #c3c3c3;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	}
	
img {
	margin: 10px;
	}

ul li {
	list-style-type: disc;
}	
	
	
#wrapper {
	background-color: white;
	margin:0px;
	
}

#encabezado {
	background-color: #dcd07e;
	height: 250px;
	width: 100%
	padding: 10px;
	}
#navegacion {
	background-color:#dcd07e;	
	padding-bottom:2px;
	text-align:center;
	border-bottom: 5px solid #dcd07e;
	}
#navegacion li {
	display:inline-block;
	list-style-type:none;
	padding:0px 3px 0px 3px
	}
#navegacion a	{
	text-decoration:none;
	outline:none;
	color:black;
	background:-moz-linear-gradient(bottom,rgba(0,0,0,.2),rgba(255,255,255,.2));
   background:-webkit-gradient(linear,0 0,0 100%,color-stop(rgba(0,0,0,.2),color-stop(rgba(255,255,255,.2)))); 
   background:-o-linear-gradient(top,rgba(0,0,0,.2),rgba(255,255,255,.2));
   background:linear-gradient(to top,rgba(0,0,0,.2),rgba(255,255,255,.2));
	padding: 4px 8px 4px 8px;
	border: 0px;
	font-size: 14px;
	}
#navegacion #nav0, #navegacion #nav10 {
	display: none;
	}

#navegacion a:hover, #navegacion a:focus, #inicio #nav1 a, #imagenes #nav2 a, #texto #nav3 a, #color #nav4 a, #fondo #nav5 a, #graficos #nav6 a, #diseno #nav7 a, #transiciones #nav8 a, #enlaces #nav9 a {
	color: #872626;
	background:-moz-linear-gradient(bottom,rgba(0,0,0,.2),rgba(255,255,255,.2));
   background:-webkit-gradient(linear,0 0,0 100%,color-stop(rgba(0,0,0,.2),color-stop(rgba(255,255,255,.2)))); 
   background:-o-linear-gradient(top,rgba(0,0,0,.2),rgba(255,255,255,.2));
   background:linear-gradient(to top,rgba(0,0,0,.2),rgba(255,255,255,.2));
	
	padding-bottom:3px;
	border-bottom:none;
	-moz-transition-duration:.4s;
	-moz-transition-delay:.05s;
	-webkit-transition-duration:.4s;
	-webkit-transition-delay:.05s;
	-o-transition-duration:.4s;
	-o-transition-delay:.05s;			
	transition-duration:.4s;
	transition-delay:.05s;
	}
	
@media screen and (max-width:800px){
	#navegacion #nav1, #navegacion #nav2, #navegacion #nav3, #navegacion #nav4, #navegacion #nav5, #navegacion #nav6, #navegacion #nav7, #navegacion #nav8, #navegacion #nav9, #home {
	display: none;	
	}
	#navegacion #nav10 {
	display:inline;
	}
	#navegacion {
	text-align: right;	
	}
	.labels-list {
		margin: 0;
    	margin-left: 1em;	
		margin-right:0;	
	}
	}	
	
	
@media screen and (max-width:800px){
	 ul.topnav.responsive {
	 	position: relative;
	 	}
  	 ul.topnav.responsive #nav10 {
    position: absolute;
    right: 0;
    top: 0;
  	}
  	
  	#navegacion ul.topnav.responsive #nav0, #navegacion ul.topnav.responsive #nav1, #navegacion ul.topnav.responsive #nav2, #navegacion ul.topnav.responsive #nav3, #navegacion ul.topnav.responsive #nav4, #navegacion ul.topnav.responsive #nav5, #navegacion ul.topnav.responsive #nav6, #navegacion ul.topnav.responsive #nav7, #navegacion ul.topnav.responsive #nav8, #navegacion ul.topnav.responsive #nav9 {
	 float:none;    
    display: inline;
  	}
  #navegacion ul.topnav.responsive #nav0, #navegacion ul.topnav.responsive #nav1 a, #navegacion ul.topnav.responsive #nav2 a, #navegacion ul.topnav.responsive #nav3 a, #navegacion ul.topnav.responsive #nav4 a, #navegacion ul.topnav.responsive #nav5 a, #navegacion ul.topnav.responsive #nav6 a, #navegacion ul.topnav.responsive #nav7 a, #navegacion ul.topnav.responsive #nav8 a, #navegacion ul.topnav.responsive #nav9 a {
    display: block;
    text-align: left;
  	}
	}		

@media screen and (min-width:800px){
	.labels-list {
		margin: 0;
    	margin-left: 1em;
    	margin-right: 100px;	
		}
	}	
	
#areatexto {
	margin-left: 5%;
	padding: 10px;
	}
#home	{
	float:right;
	font-size:14px;
	padding-left:50px;
	padding-bottom: 20px;
	text-align:right;
	}
#home img {
	border:0;
	}
#home a {
	color:#872626;
	text-decoration:none;
	}
#home a:hover {
	color:#250303;
	text-decoration:underline;	
	}
#home li {
	list-style-type:none;
	}
#titulo {
	font-size: 4em;
	font-weight: normal;
	color: #872626;
	font-family: 'Ubuntu', sans-serif;
	}
#titulo2 {
	font-size: 3em;
	font-weight: normal;
	color: #872626;
	font-family: 'Ubuntu', sans-serif;
	}	

#navpie {
	text-align: center;
	color: gray;
	}
#navpie a {
	text-decoration: none;
	color: blue;
	}
#pie {
	text-align: center;
	font-size: 80%;
	font-style: italic;
	letter-spacing: 2px;
	border-top: 1px solid #8C8C8C;
	margin-top: 20px;
	padding: 20px;
	}
	
	
	
.right {
	float: right;
	}
.titletip {
	font-size: 2em;
	color: black;
	font-family: 'Ubuntu', sans-serif;
	}
.indent {
	padding-left: 40px;
	}
.caption {
	color: gray;
	font-size: 0.8em;
	margin-left: 10px;
	}
.caption a {
	color: gray;
	}
	

/*  LISTAS  DE CONSEJOS */

.labels-list {
    list-style-type: none;
    list-style-type: decimal !ie; /*IE 7- hack*/
     
    padding: 0;
     
    counter-reset: li-counter;
}
.labels-list > li{
    position: relative;
    margin-bottom: 1.5em;
    padding: 1.5em;
    background-color: white;
}
.labels-list > li:before {
    position: absolute;
    top: -0.3em;
    left: -0.5em;
    width: 1.8em;
    height: 1.2em;
     
    font-size: 2em;
    line-height: 1.2;
    font-weight: bold;
    text-align: center;
    color: #464646;
    background-color: #d0d0d0;
    color: #872626;
     
    transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    -webkit-transform: rotate(-20deg);
    z-index: 99;
    overflow: hidden;
    
    	box-shadow: 4px 4px 2px #888888;
     
    content: counter(li-counter);
    counter-increment: li-counter;
}
.comic {
	font-family: Comic sans, Comic sans MS, cursive;
}
.grande {
	font-size: 1.5em;
	}

img {
	max-width: 100%;
	}
	
/* ========================================================= 
CSS para la animación y localización de los DIV de cookies
========================================================*/
 
@keyframes desaparecer
{
0%		{bottom: 0px;}
80%		{bottom: 0px;}
100%		{bottom: -50px;}
}
 
@-webkit-keyframes desaparecer /* Safari and Chrome */
{
0%		{bottom: 0px;}
80%		{bottom: 0px;}
100%		{bottom: -50px;}
}
 
@keyframes aparecer
{
0%		{bottom: -38px;}
10%		{bottom: 0px;}
90%		{bottom: 0px;}
100%		{bottom: -38px;}
}
 
@-webkit-keyframes aparecer /* Safari and Chrome */
{
0%		{bottom: -38px;}
10%		{bottom: 0px;}
90%		{bottom: 0px;}
100%		{bottom: -38px;}
}
#cookiesms1:target {
    display: none;
}
.cookiesms{	
	width:100%;
	height:43px;
	margin:0 auto;
	padding-left:1%;
        padding-top:5px;
        font-size: 1.2em;
	clear:both;
        font-weight: strong;
color: #333;
font-size:12px;
bottom:0px;
position:fixed;
left: 0px;
background-color: #FFF;
/*opacity:0.7;*/
filter:alpha(opacity=70); /* For IE8 and earlier */
transition: bottom 1s;
-webkit-transition:bottom 1s; /* Safari */
-webkit-box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
-moz-box-shadow:    3px -3px 1px rgba(50, 50, 50, 0.56);
box-shadow:         3px -3px 1px rgba(50, 50, 50, 0.56);
z-index:999999999;
}
 
.cookiesms:hover{
bottom:0px;
}
.cookies2{
background-color: #FFF;
display:inline;
opacity:0.95;
filter:alpha(opacity=95);
position:absolute; 
left:1%; 
top:-30px;
font-size:15px;
height:30px;
padding-left:25px;
padding-right:25px;
-webkit-border-top-right-radius: 15px;
-webkit-border-top-left-radius: 15px;
-moz-border-radius-topright: 15px;
-moz-border-radius-topleft: 15px;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
-webkit-box-shadow: 3px -3px 1px rgba(50, 50, 50, 0.56);
-moz-box-shadow:    3px -3px 1px rgba(50, 50, 50, 0.56);
box-shadow:         3px -3px 1px rgba(50, 50, 50, 0.56);
}
 
/* Fin del CSS para cookies */