html{
    background-image: url("../3-la-odisea-de-la-luz-solar.jpg");
    background-origin: padding-box;
    background-position: 0 0;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
    background-size: cover;
    overflow:auto;
/*arriba adapta viejos chrome, firefox y opera. Aquí abajo hace que ie8 entienda background-size:cover 
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
        src='../3-la-odisea-de-la-luz-solar.jpg',
        sizingMethod='scale'); 
esta estropeando la deteccion de enlaces */
}
body{/* IE10+ */ 
/*background-image: -ms-radial-gradient(right top, ellipse farthest-corner, #FFFFFF 0%, #F9FCBF 75%, #CCCCCC 100%);*/
/* Mozilla Firefox */ 
/*background-image: -moz-radial-gradient(right top, ellipse farthest-corner, #FFFFFF 0%, #F9FCBF 75%, #CCCCCC 100%);*/
/* Opera */ 
/*background-image: -o-radial-gradient(right top, ellipse farthest-corner, #FFFFFF 0%, #F9FCBF 75%, #CCCCCC 100%);*/
/* Webkit (Safari/Chrome 10) */ 
/*background-image: -webkit-gradient(radial, right top, 0, right top, 572, color-stop(0, #FFFFFF), color-stop(75, #F9FCBF), color-stop(100, #CCCCCC));*/
/* Webkit (Chrome 11+) */ 
/*background-image: -webkit-radial-gradient(right top, ellipse farthest-corner, #FFFFFF 0%, #F9FCBF 75%, #CCCCCC 100%);*/
/* W3C Markup */ 
/*background-image: radial-gradient(ellipse farthest-corner at right top, #FFFFFF 0%, #F9FCBF 75%, #CCCCCC 100%);*/
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#feffff+0,ddf1f9+25,edf7c0+44,d0f4a8+61,d7f492+76,3ef24a+90 */
background: #feffff; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
/*codigo base64 para el degradado del background de puede decodificar para ver*/
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZmVmZmZmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMjUlIiBzdG9wLWNvbG9yPSIjZGRmMWY5IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNDQlIiBzdG9wLWNvbG9yPSIjZWRmN2MwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNjElIiBzdG9wLWNvbG9yPSIjZDBmNGE4IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNzYlIiBzdG9wLWNvbG9yPSIjZDdmNDkyIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iOTAlIiBzdG9wLWNvbG9yPSIjM2VmMjRhIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(-45deg,  #feffff 0%, #ddf1f9 25%, #edf7c0 44%, #d0f4a8 61%, #d7f492 76%, #3ef24a 90%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#feffff), color-stop(25%,#ddf1f9), color-stop(44%,#edf7c0), color-stop(61%,#d0f4a8), color-stop(76%,#d7f492), color-stop(90%,#3ef24a)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(-45deg,  #feffff 0%,#ddf1f9 25%,#edf7c0 44%,#d0f4a8 61%,#d7f492 76%,#3ef24a 90%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(-45deg,  #feffff 0%,#ddf1f9 25%,#edf7c0 44%,#d0f4a8 61%,#d7f492 76%,#3ef24a 90%); /* Opera 11.10+ */
background: -ms-linear-gradient(-45deg,  #feffff 0%,#ddf1f9 25%,#edf7c0 44%,#d0f4a8 61%,#d7f492 76%,#3ef24a 90%); /* IE10+ */
background: linear-gradient(135deg,  #feffff 0%,#ddf1f9 25%,#edf7c0 44%,#d0f4a8 61%,#d7f492 76%,#3ef24a 90%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#3ef24a',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

    color:#000;
    font-family:"";
    font-size: 0.86em;
    border: #ccc 2px solid;
    margin: 1em 1em 0em 1em;
    padding: 1em 1em 0em 1em;
height: auto;
opacity:0.8;
position:absolute;
width:96%; /*soluciona problemas de body>background con Ctrl++ y Ctrl-- en las fiferentes secciones y browsers*/
padding-bottom: 3em; /*busca solucionar cobertura del color de background*/
}
/* Util para ie9 si background: linear-gradient(135deg,  #feffff 0%,#ddf1f9 25%,#edf7c0 44%,#d0f4a8 61%,#d7f492 76%,#3ef24a 90%);*/ /* W3C */
<!--[if gte IE 9]>
  <style>.gradient {filter: none;}  </style>
<![endif]-->
h1, h2, h3, h4, h5, p, ul, li{ 
    background-color: white;
    padding-bottom: 0.1em;
    padding-top: 0.1em;
}
.logo {
    height: auto;
    left: 2em;
    padding: 1em;
    position: absolute;
    top: 3em;
    width: 12.8%;
}
div#hgroup{
    position: relative;
    top: 11em;
}
header#cabecera div#hgroup h1 {
    font-family: Georgia;
    font-size: 1.4em;
    line-height: 1.4em;
    position: absolute;
    text-align: center;
    width: 24%;
}
header#cabecera div#hgroup h2 {
    border-top-color: #fff;
    border-top-style: solid;
    border-top-width: 1.2em;
    font-size: 1.2em;
    padding-bottom: 0.5em;
    padding-left: 1em;
    padding-right: 1em;
    position: relative;
    text-align: center;
    top: 7em;
    width: 62.5%;
    z-index: 10;
}
div#hgroup h3 {
    color: red;
    font-family: sans-serif;
    font-size: 1.2em;
    font-style: italic;
    font-variant-caps: all-small-caps;
    left: 0;
    position: absolute;
    top: 5.4em;
    width: 27%;
    margin-bottom: 0.5em;
    z-index: 22;
}
#menu {/* navegacion */
    margin: 3px;
    padding: 1em 0px 0px;
    position: absolute;
    right: 20px;
    text-align: center;
    top: 8px;
    z-index:12;
}
nav#menu ul li {display:inline;}
article, blockquote, .desc, h2{background-color:#fff;}
blockquote.manifiesto{
    float: right;
    height: auto;
    padding-top: 1em;
    padding-bottom: 1em;
    position: absolute;
    right: 1.6em;
    top: 16em;
    width: 101%;
-moz-box-shadow: 5px 5px 20px #000000;
-webkit-box-shadow: 5px 5px 20px #000000;
box-shadow: 5px 5px 20px #000000;
filter: progid:DXImageTransform.Microsoft.Shadow(strength = 5, direction = 135, color = '#000000');
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(strength = 5, Direction = 135, Color = '#000000')";
/*Shadows look very different in IE (Only cardinal directions supported)*/
/*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/
/*Element should have a background-color*/
/*All filters must be placed together*/
/*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/
}
blockquote {
  background: #f9f9f9;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
  font-family:"comic sans ms";
  z-index:10;
}
blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote h4 { line-height: normal;}
blockquote p { display: inline;}
article {height: 229%; width: 45.4%;}
article h1, article h2{
    background-color: #e8ffd2;
    margin: 0.4em;
    text-align: center;
}
article p{
    background-color:transparent;
    font-size:1.1em;
    padding-bottom: 0.4em;
    padding-left: 0.4em;
    padding-right: 0.4em;
    padding-top: 0.4em;
}
ul {display: flex;}
li {padding-right: 1em;}
p {line-height: 1.1em;}
footer{background: inherit;
    display: inherit; 
    bottom: 0;
    clear: both;
    position: relative; 
    z-index: 10;
    padding-bottom: 1em;
}
contacto{width:100%}
.googlemap {
    float: right;
    position: relative;
    right: 1em;
    top: 1em;
    z-index: 2;
}
.googlemap a:hover img { width: 300px; height:200px; position:relative; top:-120px;}
/*p.googlemap a img{position: relative;}*/
#copyright {
    clear: both;
    padding-top: 1em;
    text-align: center;
} 
.velux {
    background-color: red;
    font-family: georgia;
    font-weight: bold;
}
.velux, .velux a:link, .velux a:visited {
    -moz-text-decoration-color: -moz-use-text-color;
    -moz-text-decoration-line: none;
    -moz-text-decoration-style: solid;
    color: #fff;
}
.enlace, a {
    text-shadow: 1px 1px 1px #000000;
}
a.enlace2:link { font-family: Tahoma, Verdana, Arial; color: #993300; text-decoration: none}
a.enlace2:visited { font-family: Tahoma, Verdana, Arial; color: #CC9933; text-decoration: none}
a.enlace2:hover { font-family: Tahoma, Verdana, Arial; color: #996666}
a.enlace2:active { font-family: Tahoma, Verdana, Arial; color: #993300; text-decoration: none}
.hidden {display: none;}
.enlinea{ display: inline; line-height: normal;}
.pad{padding-top:1em;}


/* Estilos decorativos finales */
body::after{
  content: "";
/*  background: url("/img/10.jpg");*/
  opacity: 0.5;
  top: 0;
  left: 0;
  background-size: cover;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}
/* esta parte que quería adaptar bacgraond opacity IE =<8 lo he comentado 20160509 porque esta impidiendo leer encabezados en ie
h1,h2,#galeria,#menu ul li,.opacidad60 {
     Fallback for web browsers that don't support RGBa */
    /*background-color: rgb(0, 0, 0);
     RGBa with 0.6 opacity */
    /*background-color: rgba(255, 255, 255, 0.7);
     For IE 5.5 - 7*/
    /*filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
     For IE 8*/
    /*-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}/* In addition to this, you have to declare background: transparent for IE web browsers, preferably served via conditional comments or similar!via http://robertnyman.com/2010/01/11/css-background-transparency-without-affecting-child-elements-through-rgba-and-filters/ */
#cycleContainer div.item img.mail {
    position: static;top:0; width:auto;}