body {
  font-family: 'Open Sans', sans-serif;
  color: #333;
  font-size: 1em;
  height: auto;
  padding-bottom: 20px;
 min-width: 960px;
  
}


#menu {border: 0 none;
    margin: 0;
    width:420px;
    height:760px;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    top:0;
    z-index: 142;
    background-image: url("../images/menu.png"); background-repeat:repeat-y;  background-repeat:repeat;
}

.soft_rain,
.thunder_rain,
.big_surf,
.frog,
.bird,
.sea,
.seagull,
.foot_print
{display: block;height: 48px;  padding: 0;  width: 48px; margin: 25px;  }

.audio-player{
  position: relative;
margin:0;
  top:-125px;
  padding:0;
float:right;

}
/*
.thunder_rain {background: url("../icons/thunder.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);}
*/
.big_surf {background: url("../icons/big-surf.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);}
.frog{background: url("../icons/frog.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);}
.bird{background: url("../icons/bird.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);}
.sea{background: url("../icons/water-sea.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);}
.seagull{background: url("../icons/seagull.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);}
.foot_print{background: url("../icons/footprint.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);}
/*
.volume {background: url("../icons/volume-control.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);}*/

.reveal-modal p {line-height: 1.6em;}


/* footer */



footer
{
width:100%;
bottom: 0;
background-color: #ECF0F1;
padding:15px 0 15px 0;
position: fixed;

}

.created {margin: 0 auto; padding:0; width:160px; position: relative; top:0; right: 0;  left: 0; }
.created a {text-decoration: underline; color: inherit;}
.info{bottom: 0;padding: 0 5px 10px 0; right: 0;  z-index: 130;}
.info a {text-decoration: none;}
.email {background: url("../icons/email.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0); }
.more { background: url("../icons/info.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);}
.hide { background: url("../icons/eye-watch.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0); }
.help { background: url("../icons/help.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0); }
.email,
.more,
.hide,
.help{height: 32px;width: 32px;float:right;bottom: 0;padding: 0 0 0 10px; position: relative; top:8px;}
.morespan,
.emailspan,
.hidespan,
.helpspan
{color:#fff; font-size: 0.875em; float: right; margin-right:25px; position: relative; top:10px; bottom:0; cursor: pointer; }
.emailspan a {color: inherit; text-decoration: none;}
#share{padding:25px;z-index: 130;left:0;}