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@63: body.pdocTopic { padding: 0; margin: 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@74: .pdocImageHotspot { patrick@56: float: left; patrick@56: position: relative; patrick@56: } patrick@56: Patrick@74: /* ~~~~~~ pdocHotspot ~~~~~~~ */ Patrick@74: Patrick@74: .pdocHotspot, .pdocHotspotContent { patrick@56: position: absolute; Patrick@74: font-size: 140%; patrick@56: -webkit-tap-highlight-color: rgba(0, 0, 0, 0); patrick@56: } patrick@56: Patrick@74: .pdocHotspotContent .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@74: /* ~~~~~ 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@82: background: -webkit-radial-gradient(center, circle closest-side, transparent 10%, rgba(0, 0, 0, 0.75) 33%); patrick@0: }