/*
hoja de estilos de: / stilfolio de: / style sheet of:
	http://vivirenbicicleta.info
por/far/by Marcos Cruz 
*/
/* main **************** */
* {
margin:0;
padding:0;
}
body {
	margin: 0;
	font-family:arial, verdana, helvetica, sans-serif;
	font-size:1.1em;
	cursor:default;
}
body, #wrapper {
	color:#666666;
	background-color: #FFFFFF;
}
#wrapper {
	width: 90%;
	margin: 0 auto; /* vertical margins here works in Opera and Firefox */
	padding: 2em 0; /* vertical paddings here works in Opera, Firefox and IE */
	text-align: justify;
}
/*
q:lang(es) { quotes: "\00AB" "\00BB" "\0093" "\0094" }
q:lang(eo) { quotes: "\0093" "\0094" "\0091" "\0092" } 
q:lang(en) { quotes: "\0093" "\0094" "\0091" "\0092" } 
q:before { content: open-quote }
q:after { content: close-quote }
*/
/*
q {
  quotes: '«' '»' '"' '"' "'" "'"; 
}
*/
q { quotes: "\00AB" "\00BB" "\0093" "\0094" }
/*
q:before, q:lang(es):before { content:"\201C"}
q:after, q:lang(es):after { content:"»"}
q q:before, q:lang(es) q:before { content:"&lquo;"}
q q:after, q:lang(es) q:after { content:"&rquo;"}
*/
table, dl, dt, ol, ul,  p {
	margin-top:1em;
}
ul.nolist {
	list-style:none;
}
abbr, acronym, .glossary {
	cursor:help;
}
.glossary {
	cursor:help;
}
.hidden {
	display:none;
}
abbr.first, acronym.first, .glossary {
	border-bottom-color: #CCCCCC;
	border-bottom-style: dotted;
	border-bottom-width: thin;
}
td, th {
	padding:.2em;
}
ul {
	margin-bottom:1em;
}
li {
	margin-top:.2em;
	text-align: left;
}
ul.clearli li {
	clear: both;
}
/* columns **************** */
#columns { 
	/* float: left; */
	/* width: 100%; */
	/* margin-top: 5px;
	margin-left: 0;
	margin-right: 0; */
	/* overflow: hidden; */
	/* background: #fff; */
	/* width:100%; */
	/* padding-left:130px; */ /* sidecolumn width */
}
#sidecolumn, #contentcolumn {
	/* position:absolute; */
	/* float:left; */
}
/* content column **************** */
#contentcolumn {
	/* width:77%; */
	/* float:right; */
	/* margin-left:10em; */ /* unnecessary; anyway it makes it too large in Opera */
	overflow:hidden;
	/* padding-left:250; */
	/* 
	about the right column width:
	width:60%;
	Some browsers consider the width of the container box, the main container.
	Other browsers consider only the width left by the left column.
	
	no width: works in EPOC Opera	5.14 but wastes space on the right
	auto: works in EPOC Opera	5.14 but wastes space on the right
	>75%: does not work in EPOC Opera	5.14
	>77%: does not work in IE 6
	100%: works fine in Opera 9.02 and IE 7
	100%: does not work in Opera 9.10 and Mozilla 2.0
	*/
	color:#666666;
	background-color: #FFFFFF;
}
#contentcolumn p {
	/* line-height:20px;
	padding:1em; */
	padding: 0 1em;
}
#contentcolumn dl {
	padding: 0 1em;
	}
/* side column **************** */
#sidecolumn {
	float:left;
	overflow:hidden;
/*	bottom:0; */
	/*width:20%; */ /* background image width: 122 px */
	width: 9em; /* background image width: 122 px */
	color:#666666;
	/* background: #FFFFFF url(img/sim/1971_marcos_cruz.jpg) no-repeat 0 0; */
	/* padding-top:208px; */ /* height of the image */
	/* padding-right:1em; */
	/* border-right:1px solid #CCCCCC; */
	margin-bottom:1em;
	padding: .2em;
}
/* titles **************** */
h2 {
	clear: left;
	font-weight:300;
	color:#FFBA27;
	background-color:#F9F9F9;
	border:1px solid #CCCCCC;
	text-align:left;
}
#contentcolumn h2 {
	font-size:120%;
	padding:5px;
	margin-top:1em;
}
#sidecolumn h2 {
	font-size:110%;
	padding:2px;
	margin: 0 0 1em 0;
	}
div.newcontent+div.newheading {
	clear: left;
	padding-top:1em; /* margin-top doesn't work here */
}
.newheading a,
.newheading a:visited,
.newheading a:active {
	background-color:#F9F9F9;
}
.newheading a:hover {
	background-color: #FFBA27;
}
.newtitle {
	text-align:left;
}
.newdate {
	color:#666666;
	background-color:#F9F9F9;
	font-size:80%;
}
h3 {
	clear: left;
	font-weight:300;
	color:#FFBA27;
	background-color:#F9F9F9;
	text-align:left;
	margin-top:1em;
}
#contentcolumn h3 {
	font-size:110%;
	padding:5px;
}
#sidecolumn h3 {
	font-size:100%;
	padding:2px;
	font-weight:normal;
}
h1,h2,h3 {
/* rounded corners */
border-radius: .5em; /* CSS3 syntax */
-moz-border-radius: .5em; /* Mozilla engine syntax */
-webkit-border-radius: .5em; /* Apple Webkit engine syntax */
-opera-border-radius: .5em; /* Opera engine syntax, not supported yet */
-khtml-border-radius: .5em; /* KHTML engine syntax, not supported yet */
}
/* links **************** */
/* colors
	#FFBA27 original orange
	#FFAC00 a bit darker
	#FFD57D a bit lighter
*/
.whiteout { /* for link separators */
   background: #ffffff;
   color: #ffffff;
}
a {
	color: #FFAC00;
	background-color:#FFFFFF;
	text-decoration:underline;
}
a:visited {
	color: #666666;
	background-color:#FFFFFF;
	text-decoration:underline;
}
a:hover {
	color: #FFFFFF;
	background-color: #FFBA27;
	text-decoration: none;
}
a:active {
	color: #FFBA27;
	background-color:#FFFFFF;
	text-decoration:none;
}
.enlacespatrocinados a,
.adblock a,
.externallink a {
	background: transparent url(./img/sim/external_link_ffac00.gif) no-repeat scroll right;
	padding-right:15px;
}
.enlacespatrocinados a:visited,
.adblock a:visited,
.externallink a:visited {
	background: transparent url(./img/sim/external_link_666666.gif) no-repeat scroll right;
	padding-right:15px;
}
.enlacespatrocinados a:hover,
.adblock a:hover,
.externallink a:hover {
	color: #FFFFFF;
	text-decoration: none;
	background: #FFBA27 url(./img/sim/external_link_ffffff.gif) no-repeat scroll right;
	padding-right:15px;
}
.externallinkmark {
}
/* header **************** */
#header {
	/* background: #FFFFFF url(img/sim/1971_marcos_cruz.jpg) no-repeat 0 0;  */
	/* padding-left:122px;  */ /* width of the image */
	/* height:100px; */
	margin:0 0 1em;
/*	padding-bottom: 1em;
	border-bottom:1px solid #CCCCCC;
*/
}
div#sitetitle {
}
div#sitetitle cite.sitetitle {
	font-size:200%;
	color:#FFBA27;
	background-color:#FFFFFF;
	font-weight:700;
	font-style:normal;
}
div#sitetitle cite.sitesubtitle {
	font-size:120%;
	color:#666666;
	background-color:#FFFFFF;
	font-weight:300;
	font-style:normal;
}
div#logo {
}
div#sitetitle a,
div#logo a {
	text-decoration:none;	
	color:inherit;
	background-color:#FFFFFF;
}
div#heading {
	width:100%;
}
h1 {
	clear:both;
	font-size:150%;
	color:#FFBA27;
	background-color:#FFFFFF;
	padding:0; /* if greater, everything goes wrong */
	margin:0;
	border-bottom: 1px solid #CCCCCC;
	text-align:left;
}
h1 span.postdate {
	font-size:80%;
	color:#666666;
	font-weight: normal;
}
#descriptionbox {
	clear:both;
	width: 100%;
	padding: 0 ;
	margin: 1px 0 1em ;
	border-bottom: 1px solid #CCCCCC;
}
#description {
	margin: 1px 0;
	text-align:left;
}
#description p {
	display:inline;
	color:#666666;
	background-color:#FFFFFF;
	text-align:left;
	font-size: 90%;
	margin: 0;
	padding: 0;
	border:0;
}
#description p.title {
	font-weight:bold;
	margin:0 .5em 0 0;
}
/* skip buttons **************** */
div.skip {
	display:none;
	/* This has the same visual effect than display:none but will be read by screen readers: */
/*	width:0;
	height:0;
	overflow:hidden; */
	/* I learned this trick in www.htmldog.com */
}
/* language bar **************** */
div#langbar {
	float:right;
	text-align:right;
	font-size:80%;
}
div#langbar ul{
	margin-left: 0;
	padding-left: 0;
	display: inline;
}
div#langbar ul li {
	margin-left: 0;
	padding: 0 0 0 4px;
	list-style: none;
	display: inline;
}
div#langbar li + li {
	border-left: 1px solid #CCCCCC;
}
/* bars **************** */
div.bar ul li.apart {
	margin-top:1em;
}
div.bar ul {
	padding-bottom:1em;
	list-style:none;
	margin:0;
	padding-left:0;
	color:#666666;
	background-color:#FFFFFF;
}
/* navigation bar **************** */
div#navbar {
	font-size:120%;
	text-align:left;
	/* margin-right:.5em; */
	padding-top: 1em; /* margin-top doesn't work in IE7 */
}
div#navbar strong {
	color: #FFBA27;
	background-color:#FFFFFF;
}
div#navbar a strong.buttonkey { 
	/* needed by IE */
	text-decoration:underline;
	/* needed? */
	color: #FFAC00;
	background-color:#FFFFFF;
	text-decoration:underline;
}
div#navbar a:visited strong.buttonkey { 
	/* needed? */
	color: #666666;
	background-color:#FFFFFF;
	text-decoration:underline;
}
div#navbar a:hover strong.buttonkey {
	/* needed by IE */
	text-decoration:none;
	/* needed? */
	color: #FFFFFF;
	background-color: #FFBA27;
	text-decoration: none;
}
/* breadcrumbs **************** */
div#breadcrumbs {
	font-size:90%;
	clear:both;
	text-align:left;
	margin-top:.5em;
	/* border-top: 1px solid #CCCCCC; */
	/* float:left; /* needed for Opera and Firefox */
}
div#breadcrumbs ul{
	margin-left: 0;
	padding-left: 0;
	display: inline;
}
div#breadcrumbs ul li {
	margin-left: 0;
	padding: 0;
	list-style: none;
	display: inline;
}
/* related links **************** */
div.relatedlinks {
  /* height:1.5em; */
  /* border-bottom:1px solid #c0c0c0; */
  /* padding-bottom:.5em; */
  /* margin-bottom:1em; */
  clear:both;
  font-size:90%;
  /* border-top:1px solid #CCCCCC; */
  margin-top:1em;
}
div#heading div.relatedlinks {
  border: 0;  
  margin-top:0;
}
div.left50, div.right50  {
  width:49%;
  }
div.left50 {
  clear:both;
  float:left;
  text-align: left;
}
div.right50 {
  float: right;
  text-align: right;
}
div.relatedlinks div.left50, div.relatedlinks div.right50  {
  margin-bottom:.5em;
  }
div.relatedup { /* to apart the upper related links off the breadcrumbs; needed by Opera 9.1 and Firefox 2 */
  clear:both;
  border-bottom:1px solid #CCCCCC;
  /* margin: .5em 0; */
}
div.relateddown { /* to apart the down related links off the cvontent; needed by IE 6 and 7 */
  clear:both;
  border: 1px solid red;
  /* border-top:1px solid #CCCCCC; */
  /* margin: .5em 0; */
}
div.toplink {
	float:right;
}
/* google search **************** */
#googlesearch {
	clear:left;
	margin: 1em auto 0 auto;
	border-top: 1px solid #CCCCCC;
	padding: 1em 0;
	line-height:1.3em;
	font-size:90%;
	text-align:left;
}
#googlesearch input.submit {
	padding:.2em;
}
/* ads **************** */
div.adblocks {
/*
	padding: .5em .5em .5em 0;
	border-top: 2px solid #CCCCCC;
	border-right: 2px solid #CCCCCC;
	border-bottom: 2px solid #CCCCCC;
*/
	margin-top: .5em;
	}
div.adblock + div.adblock,
h2 + div.adblock,
h3 + div.adblock {
	/* border-top: 1px dotted #CCCCCC; */
	}
/* enlaces patrocinados  */
div.enlacespatrocinados,
div.anunciosdetexto,
div.adblock {
/*
	margin-top:1em ;
	border-top: 1px solid #CCCCCC;
*/
	text-align: left;
}
div.enlacespatrocinados p,
div.anunciosdetexto p,
div.adblock p {
	font-size:90%;
}
div.enlacespatrocinados ul,
div.anunciosdetexto ul,
div.adblock ul {
	margin: 1em;
	padding: 0;
	text-align: left;
}
div.enlacespatrocinados ul li,
div.anunciosdetexto ul li,
div.adblock ul li {
	list-style-type: circle;
	font-size:90%;
}
/* adsense **************** */
#adsensecol {
	clear:left;
	margin: 1em 0;
	padding: 1em 0;
	/* margin-bottom has no efect in Opera and Firefox */
}
.adsensev + .adsensev {
	margin-top: 1em;
}
.adsensereference {
	margin-top: 1em;
}
#adcontenttop,
#adsensecontenttop {
	margin-bottom: 1em;
/*
	border-bottom: 1px solid #CCCCCC;
	padding-bottom:1em;
*/
	text-align:center;
}
#adcontenttop a:hover {
	/* prevent color effect with banners in Opera */
	color: #FFAC00;
	background-color:#FFFFFF;	
}
#adsensecontentbottom {
	clear:both;
	margin-top: 1em;
/*	border-top: 1px solid #CCCCCC; */
	padding-top:1em;
	text-align:center;
	}
#adsensefooter {
	clear:both;
	margin-bottom: 1em;
	border-bottom: 1px solid #CCCCCC;
	padding-bottom:1em;
	text-align:center;
	}
#adsensebox {
	float: left;
	margin: 1em 1em 1em 1em;
	
}
div.knowmoread {
	float:right;
	margin: 1em 1em 1em 1em;
}
/* enlaces intercambiados  */
div.exchangedlinks {
	margin-top:1em ;
	/* border-top: 1px solid #CCCCCC; */
}
div.exchangedlinks p {
	font-size:90%;
	text-align:left;
}
div.exchangedlinks ul {
	margin: 1em;
	padding: 0;
	text-align: left;
}
div.exchangedlinks ul li {
	list-style-type: circle;
	font-size:90%;
}
/* social bookmarking **************** */
div.sb {
	/* border-top: 1px solid #CCCCCC; */
}
div.sb p {
	text-align: left;
	}
div.sb ul {
	font-size:90%;
	margin:1em 1em 1em 0;
	padding:0;
}
div.sb li {
	/* border:1px solid red; */
	width:20px;
	height:20px;
	float:left;
	list-style:none;
}
div.sb a:hover {
	color:#666666;
	background-color: #FFFFFF;
}
div.aftersb { /* needed by Opera */
	clear:left;
	padding:0;
	margin:0;
	height:1px;
}
/*
.news {
	color:#999999;
	border-bottom:1px;
	border-left:1px;
	border-right:1px;
	border-top:0px;
	border-style:solid;
	border-color:#666666;
	background-color:#FFFFFF;
	line-height:20px;
	padding:5px;
}
*/
/* footer **************** */
#footer {
	clear:both;
	margin-top: 1em;
	border-top: 1px solid #CCCCCC;
	padding-top:1em;
	font-size:80%;
	text-align:left;
}
#footer p {
	clear:both;
}
ul#w3clinks  /* #w3clinks for the main list at the footer */
	{  
	float:left;
	list-style:none;
	display:inline;
	margin: 0 0 .5em 0;
	padding-left:0;
}
ul.w3clinks  /* .w3clinks to show the links inside the page content (e.g. in the page about accesibility) */
	{  
	list-style:none;
	margin: 1em;
	padding:0;
}
ul#w3clinks li ,
ul.w3clinks li {
	display:inline;
	margin-right:1em;
}
ul#w3clinks a ,
ul.w3clinks a {
	color:inherit;
	background-color:#FFFFFF;
}
#cclogo {
	float:right;
	margin: 0 0 .5em 0;
}
#cclogo a {
	color:inherit;
	background-color:#FFFFFF;
}
#footer address {
	font-style: normal;
	margin-top: .5em;
}
.pagedate
{
	font-weight:bolder;
}
.isodate { /* ¿sin uso? */
	font-family: courier new, courier, monospace;
}
#copyleft img {
	margin-right:.5em;
	}
#pageuri {
	border-top: 1px solid #CCCCCC;
	text-align:right;
	margin-top:.5em;
	}
/* images **************** */
img {
	border: none
}
.rightimg {
	float: right;
	clear: right;
	margin: 1em ;
}
.leftimg {
	float: left;
	/* clear: left; */
	margin: 1em ;
}
.centerimg {
	clear: both;
	margin: 1em auto;
	text-align:center; /* needed to center nested <object> */
}
.centerimg img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}	
.rightthumb {
	float: right;
	margin: 1em;
/*	text-align: center; */
}
.leftthumb {
	float: left;
	margin: 1em;
/*	text-align: center;  */
}
.leftclearthumb {
	clear: both; 
	float: left;
	margin-top: 1em;
	margin-right: 1em;
	margin-bottom: 1em;
	text-align: center;
}
div.imglink, div.imgr {
	font-size: 80%;
	text-align: center
}
/* multimedia **************** */
div.leftobject object.youtube {
	float: left;
	clear: left;
	margin: 1em;
}
div.rightobject object.youtube {
	float: right;
	clear: right;
	margin: 1em;
}	
div.centerimg object.youtube {
	clear: both;
	margin: 1em auto;
}	
/* blocks **************** */
#note {
	font-style: italic;
	border-bottom: 1px solid #CCCCCC ;
	margin-bottom: 1em ;
}
#published {
	clear: both;
	border-top: 1px solid #CCCCCC ;
	margin: 1em 0;
	text-align: left;
}
#published p { margin-bottom: 0}
div#references {
	/* main references list */
	clear: both;
	margin: 1em 0;
	border-top: 1px solid #CCCCCC;
}
/*
div#references dl {
	margin-left:1em;
}
div.references ul {
	margin-left: 1em;
	margin-top: 1em;
	list-style:none;
}
*/
blockquote {
	clear:left;
}
blockquote.cit {
	margin: 1em 10%;
	padding: 1em;
	border: 1px solid #CCCCCC;
	border-style: outset;
	font-size:120%;
	text-align: justify;
	font-family: Times New Roman, Garamond, serif;
	color: #666666;
	background-color:#FFFFFF;
}
blockquote.email {
	width:80%;
	margin: 1em auto;
	padding: 1em;
	border: 1px solid #CCCCCC;
	font-size:110%;
	font-family:courier, monospace;
	text-align:left;
}
blockquote.email div.emailheader {
	padding-bottom:1em;
	border-bottom: 1px solid #CCCCCC;
}
blockquote.email div.emailheader p {
	padding: 0 ;
	margin: 0 ;
}
blockquote.email div.quotedemail {
	font-style:italic;
}
blockquote,
blockquote.normal,
blockquote.song,
blockquote.interview,
blockquote.press,
blockquote.example {
	margin: 1em;
	/* background-image:url(img/sim/comillas.gif); */
	background-image:url(img/sim/comillas_castellanas_48px_ffba27.png);
	background-repeat:no-repeat;
	background-position: top left;
	padding-left:22px;
}
blockquote.manual {
	width:80%;
	margin: 1em auto;
	padding: 1em;
	border: 1px solid #CCCCCC;
	border-left-width: 3px;
}
blockquote.interview p.interviewer span.name {
	font-weight: bolder;
}
blockquote.interview p.interviewed span.name {
	font-weight: bolder;
}
/*
blockquote.song {
	margin: 1em;
	background-image:url(img/sim/notas_musicales.gif);
	background-repeat:no-repeat;
	background-position: top left;
	padding-left:53px;
}
*/
blockquote.song p {
	text-align:left;
}
blockquote p.source {
	font-size:90%;
}
blockquote .source span.surname {
	text-transform:uppercase;
}
/* lists **************** */
dt {
	margin-top:1em;
	text-align:left;
	clear:left;
}
ul.bike26 {
padding-top: 1em;
margin-left: 8em;
padding-left: 8em;
}
ul.tent {
	margin-left: 8em;
	padding-left: 8em;
}
/*
dl.book dt {
	display:inline;
	margin-left: 1em;
	margin-right: .5em;
}
dl.book dd {
	display:inline;
}
*/
div.storyline {
	margin: 0 2em;
	/* background-image:url(img/sim/papel_rayado.jpg); */
	clear:both;
	/* float:left; */
	padding-top:1em;
}
ol.storyline {
}
li.storylinestep {
	clear:both;
	list-style: none;
	padding-left: 1em;
	padding-right: 1em;
}
li.storylinestep + li.storylinestep {
	border-top: 1px dotted #CCCCCC;
}
div.tripstory {
	clear:both;
}
div.tripstorystep {
	clear:both;
}
/*
div.museum{
	margin-left: 12%;
	margin-right: 12%;
}
ul.museum {
	clear: both;
	padding: 5%;
}
*/
ul.museum li {
	clear: both;
	list-style: none;
/*	padding-left: 5%;
	padding-right: 2%; */
}
ul, ol {
	margin-left: 1em;
	padding-left:1em;
}
ul.ind {
	clear:left;
}
ul.ind ul {
	margin-left: 3em;
	
}
ul.ind li {
	margin-top:.2em;
}
ol { margin-left: 1em;padding: 0em 1em 1em 2em;}
dl.trip {
}
dl.trip dt {
	display:inline;
	margin: 0;
}
dl.trip dd {
	display:inline;
}
#contentcolumn dl.trip dd p {
	/* The #contentcolumn id should not be needed
	to overwrite the "#contentcolum p" style, but it is.
	I don't know why. */
	padding:0;
}
/* trips **************** */
table.tripdata th,
table.daytripdata th,
table.tripdata tr,
table.daytripdata tr {
	text-align: right;
}
table.daytripdata th.location,
table.daytripdata td.location {
	text-align: left;
	width: 16em;
}
table.tripdata th.journey,
table.tripdata td.journey {
	text-align: left;
	width: 24em;
}
table.tripdata td.total {
	text-align: right;
}
table.tripdata th,
table.daytripdata th,
table.tripdata td,
table.daytripdata td {
	border-left: 1px dotted gray;
	border-top: 1px dotted gray;
}
/* misc **************** */
kbd {
	font-family: courier, monospace;
}
q {
	font-style: italic; /* IE6 and IE7 don't quote this tag so italic is used */
}