patrick@0: /* $Id$ */
patrick@0: /* balade_nature */
patrick@0: 
patrick@0: @font-face {
patrick@0:   font-family: MinyaNouvelle;
patrick@0:   font-weight: normal;
patrick@0:   font-style: normal;
patrick@0:   src: url('../Fonts/minyanouvelle.otf') format('opentype');
patrick@0: }
patrick@0: 
patrick@0: body {
patrick@0:   width: ${width}px;
patrick@0:   height: ${height}px;
patrick@0: }
patrick@0: body.pdocTopic { padding: 0; }
patrick@0: 
patrick@56: img { max-width: 100%; max-height: 100%; }
patrick@56: 
patrick@56: 
patrick@56: 
patrick@56: /* ======= BLOCK LEVEL ====== */
patrick@56: 
patrick@56: 
patrick@0: /* ~~~~~~~ pdocMedia ~~~~~~~~ */
patrick@0: 
patrick@0: .pdocMedia {
patrick@56:   position: relative;
patrick@0:   margin: 0;
patrick@0: }
patrick@0: 
patrick@0: .pdocMediaCaptionAbsolute {
patrick@56:   position: absolute;
patrick@0:   text-align: center;
patrick@0:   width: 100%;
patrick@0: }
patrick@0: 
patrick@23: /* ~~~~~~~ pdocImage ~~~~~~~~ */
patrick@23: 
patrick@56: .pdocImage {
patrick@56:   max-width: 100%;
patrick@56:   max-height: 100%;
patrick@56: }
patrick@56: 
patrick@56: .pdocImage.tooltip, .pdocImage.hotspot {
patrick@56:   float: left;
patrick@56:   position: relative;
patrick@56: }
patrick@56: 
patrick@56: .pdocImageHotspot {
patrick@56:   position: absolute;
patrick@56: }
patrick@56: 
patrick@56: .pdocImageHotspot a {
patrick@56:   display: block;
patrick@56:   text-decoration: none;
patrick@56:   border: 1px dotted gray;
patrick@56: }
patrick@56: 
patrick@56: .pdocImagePulse {
patrick@56:   position: absolute;
patrick@56:   cursor: pointer;
patrick@56:   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
patrick@56: }
patrick@56: 
patrick@0: .pdocImageTooltip {
patrick@56:   position: absolute;
patrick@56:   display: none;
patrick@56:   color: white;
patrick@0:   font-size: 140%;
patrick@23:   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
patrick@56:   text-shadow: 1px 1px 1px #bbbbbb;
patrick@0: }
patrick@0: .pdocImageTooltip .pdocP {
patrick@0:   color: white;
patrick@0: }
patrick@0: 
patrick@0: /* ~~~~~~~~~~ pdocP ~~~~~~~~~ */
patrick@0: 
patrick@0: .pdocP {
patrick@0:   font-family: MinyaNouvelle;
patrick@0:   font-size: 220%;
patrick@0:   color: #603a19;
patrick@0: }
patrick@0: 
patrick@0: /* ~~~~~ media-overlay ~~~ */
patrick@0: 
patrick@0: .-epub-media-overlay-active {
patrick@0:   background-color: yellow;
patrick@16: }
patrick@16: 
patrick@16: 
patrick@16: /* ========= EFFECTS ======== */
patrick@16: 
patrick@16: 
patrick@16: /* ~~~~~~~~~~ Glow ~~~~~~~~~~ */
patrick@16: 
patrick@16: #effectGlow {
patrick@16:   position: relative;
patrick@16:   width: 100%;
patrick@16:   height: 100%;
patrick@16:   overflow: hidden;
patrick@16: }
patrick@16: 
patrick@16: #effectGlowSpot {
patrick@16:   position: absolute;
patrick@16:   top: -50%;
patrick@16:   left: -50%;
patrick@16:   width: 200%;
patrick@16:   height: 200%;
patrick@16:   cursor: none;
patrick@16:   background: -moz-radial-gradient(center 45deg, circle closest-side, transparent 10%, rgba(0, 0, 0, 0.75) 33%);
patrick@56:   /* background: -webkit-gradient(radial, center center, 30, center center, 300, from(rgba(0,0,0,0)), to(rgba(0,0,0,.75))); */
patrick@0: }