wip #2643 @4

diff --git a/js/libs/countup/countup.min.js b/js/libs/countup/countup.min.js
new file mode 100644 (file)
index 0000000..d0ad750
--- /dev/null
+++ b/js/libs/countup/countup.min.js
@@ -0,0 +1,247 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+// playground: stackblitz.com/edit/countup-typescript
+var CountUp = /** @class */ (function () {
+    function CountUp(target, endVal, options) {
+        var _this = this;
+        this.target = target;
+        this.endVal = endVal;
+        this.options = options;
+        this.version = '2.0.4';
+        this.defaults = {
+            startVal: 0,
+            decimalPlaces: 0,
+            duration: 2,
+            useEasing: true,
+            useGrouping: true,
+            smartEasingThreshold: 999,
+            smartEasingAmount: 333,
+            separator: ',',
+            decimal: '.',
+            prefix: '',
+            suffix: ''
+        };
+        this.finalEndVal = null; // for smart easing
+        this.useEasing = true;
+        this.countDown = false;
+        this.error = '';
+        this.startVal = 0;
+        this.paused = true;
+        this.count = function (timestamp) {
+            if (!_this.startTime) {
+                _this.startTime = timestamp;
+            }
+            var progress = timestamp - _this.startTime;
+            _this.remaining = _this.duration - progress;
+            // to ease or not to ease
+            if (_this.useEasing) {
+                if (_this.countDown) {
+                    _this.frameVal = _this.startVal - _this.easingFn(progress, 0, _this.startVal - _this.endVal, _this.duration);
+                }
+                else {
+                    _this.frameVal = _this.easingFn(progress, _this.startVal, _this.endVal - _this.startVal, _this.duration);
+                }
+            }
+            else {
+                if (_this.countDown) {
+                    _this.frameVal = _this.startVal - ((_this.startVal - _this.endVal) * (progress / _this.duration));
+                }
+                else {
+                    _this.frameVal = _this.startVal + (_this.endVal - _this.startVal) * (progress / _this.duration);
+                }
+            }
+            // don't go past endVal since progress can exceed duration in the last frame
+            if (_this.countDown) {
+                _this.frameVal = (_this.frameVal < _this.endVal) ? _this.endVal : _this.frameVal;
+            }
+            else {
+                _this.frameVal = (_this.frameVal > _this.endVal) ? _this.endVal : _this.frameVal;
+            }
+            // decimal
+            _this.frameVal = Math.round(_this.frameVal * _this.decimalMult) / _this.decimalMult;
+            // format and print value
+            _this.printValue(_this.frameVal);
+            // whether to continue
+            if (progress < _this.duration) {
+                _this.rAF = requestAnimationFrame(_this.count);
+            }
+            else if (_this.finalEndVal !== null) {
+                // smart easing
+                _this.update(_this.finalEndVal);
+            }
+            else {
+                if (_this.callback) {
+                    _this.callback();
+                }
+            }
+        };
+        // default format and easing functions
+        this.formatNumber = function (num) {
+            var neg = (num < 0) ? '-' : '';
+            var result, x, x1, x2, x3;
+            result = Math.abs(num).toFixed(_this.options.decimalPlaces);
+            result += '';
+            x = result.split('.');
+            x1 = x[0];
+            x2 = x.length > 1 ? _this.options.decimal + x[1] : '';
+            if (_this.options.useGrouping) {
+                x3 = '';
+                for (var i = 0, len = x1.length; i < len; ++i) {
+                    if (i !== 0 && (i % 3) === 0) {
+                        x3 = _this.options.separator + x3;
+                    }
+                    x3 = x1[len - i - 1] + x3;
+                }
+                x1 = x3;
+            }
+            // optional numeral substitution
+            if (_this.options.numerals && _this.options.numerals.length) {
+                x1 = x1.replace(/[0-9]/g, function (w) { return _this.options.numerals[+w]; });
+                x2 = x2.replace(/[0-9]/g, function (w) { return _this.options.numerals[+w]; });
+            }
+            return neg + _this.options.prefix + x1 + x2 + _this.options.suffix;
+        };
+        this.easeOutExpo = function (t, b, c, d) {
+            return c * (-Math.pow(2, -10 * t / d) + 1) * 1024 / 1023 + b;
+        };
+        this.options = __assign({}, this.defaults, options);
+        this.formattingFn = (this.options.formattingFn) ?
+            this.options.formattingFn : this.formatNumber;
+        this.easingFn = (this.options.easingFn) ?
+            this.options.easingFn : this.easeOutExpo;
+        this.startVal = this.validateValue(this.options.startVal);
+        this.frameVal = this.startVal;
+        this.endVal = this.validateValue(endVal);
+        this.options.decimalPlaces = Math.max(0 || this.options.decimalPlaces);
+        this.decimalMult = Math.pow(10, this.options.decimalPlaces);
+        this.resetDuration();
+        this.options.separator = String(this.options.separator);
+        this.useEasing = this.options.useEasing;
+        if (this.options.separator === '') {
+            this.options.useGrouping = false;
+        }
+        this.el = (typeof target === 'string') ? document.getElementById(target) : target;
+        if (this.el) {
+            this.printValue(this.startVal);
+        }
+        else {
+            this.error = '[CountUp] target is null or undefined';
+        }
+    }
+    // determines where easing starts and whether to count down or up
+    CountUp.prototype.determineDirectionAndSmartEasing = function () {
+        var end = (this.finalEndVal) ? this.finalEndVal : this.endVal;
+        this.countDown = (this.startVal > end);
+        var animateAmount = end - this.startVal;
+        if (Math.abs(animateAmount) > this.options.smartEasingThreshold) {
+            this.finalEndVal = end;
+            var up = (this.countDown) ? 1 : -1;
+            this.endVal = end + (up * this.options.smartEasingAmount);
+            this.duration = this.duration / 2;
+        }
+        else {
+            this.endVal = end;
+            this.finalEndVal = null;
+        }
+        if (this.finalEndVal) {
+            this.useEasing = false;
+        }
+        else {
+            this.useEasing = this.options.useEasing;
+        }
+    };
+    // start animation
+    CountUp.prototype.start = function (callback) {
+        if (this.error) {
+            return;
+        }
+        this.callback = callback;
+        if (this.duration > 0) {
+            this.determineDirectionAndSmartEasing();
+            this.paused = false;
+            this.rAF = requestAnimationFrame(this.count);
+        }
+        else {
+            this.printValue(this.endVal);
+        }
+    };
+    // pause/resume animation
+    CountUp.prototype.pauseResume = function () {
+        if (!this.paused) {
+            cancelAnimationFrame(this.rAF);
+        }
+        else {
+            this.startTime = null;
+            this.duration = this.remaining;
+            this.startVal = this.frameVal;
+            this.determineDirectionAndSmartEasing();
+            this.rAF = requestAnimationFrame(this.count);
+        }
+        this.paused = !this.paused;
+    };
+    // reset to startVal so animation can be run again
+    CountUp.prototype.reset = function () {
+        cancelAnimationFrame(this.rAF);
+        this.paused = true;
+        this.resetDuration();
+        this.startVal = this.validateValue(this.options.startVal);
+        this.frameVal = this.startVal;
+        this.printValue(this.startVal);
+    };
+    // pass a new endVal and start animation
+    CountUp.prototype.update = function (newEndVal) {
+        cancelAnimationFrame(this.rAF);
+        this.startTime = null;
+        this.endVal = this.validateValue(newEndVal);
+        if (this.endVal === this.frameVal) {
+            return;
+        }
+        this.startVal = this.frameVal;
+        if (!this.finalEndVal) {
+            this.resetDuration();
+        }
+        this.determineDirectionAndSmartEasing();
+        this.rAF = requestAnimationFrame(this.count);
+    };
+    CountUp.prototype.printValue = function (val) {
+        var result = this.formattingFn(val);
+        if (this.el.tagName === 'INPUT') {
+            var input = this.el;
+            input.value = result;
+        }
+        else if (this.el.tagName === 'text' || this.el.tagName === 'tspan') {
+            this.el.textContent = result;
+        }
+        else {
+            this.el.innerHTML = result;
+        }
+    };
+    CountUp.prototype.ensureNumber = function (n) {
+        return (typeof n === 'number' && !isNaN(n));
+    };
+    CountUp.prototype.validateValue = function (value) {
+        var newValue = Number(value);
+        if (!this.ensureNumber(newValue)) {
+            this.error = "[CountUp] invalid start or end value: " + value;
+            return null;
+        }
+        else {
+            return newValue;
+        }
+    };
+    CountUp.prototype.resetDuration = function () {
+        this.startTime = null;
+        this.duration = Number(this.options.duration) * 1000;
+        this.remaining = this.duration;
+    };
+    return CountUp;
+}());

diff --git a/js/libs/fluidbook/fluidbook.links.js b/js/libs/fluidbook/fluidbook.links.js
index 89b2f348adf8040abd6ebd4cfc059cd4789fcc31..09d38f26c77f7435b97efbc3a9feb89a3328532a 100644 (file)
--- a/js/libs/fluidbook/fluidbook.links.js
+++ b/js/libs/fluidbook/fluidbook.links.js
@@ -233,6 +233,7 @@ FluidbookLinks.prototype = {
             var from = {};
             var to = {};
             var duration = 0.5;
+            var tweenmax = true;
             if (animation.duration !== undefined) {
                 duration = parseFloat(animation.duration);
             }
@@ -281,7 +282,7 @@ FluidbookLinks.prototype = {
                 var defaultParams = {startAngle: '0', direction: 'clockwise', size: 'outside', innerRadius: '0'};
                 animation = $.extend({}, defaultParams, animation);
                 animation.startAngle = parseFloat(animation.startAngle);
-                animation.innerRadius=parseFloat(animation.innerRadius);
+                animation.innerRadius = parseFloat(animation.innerRadius);
                 console.log(animation);
                 if (animation.direction === 'clockwise') {
                     from.angle = animation.startAngle + 720;
@@ -338,10 +339,59 @@ FluidbookLinks.prototype = {
                         stroke: 'none'
                     });
                 };
+            } else if (animation.type === 'number') {
+                tweenmax = false;
+                var defaultParams = {
+                    startValue: '0',
+                    decimalSeparator: '.',
+                    decimalDigitNumber: '0',
+                    separator: ' ',
+                    align: 'left',
+                    letterSpacing: '0',
+                    prefix: '',
+                    suffix: '',
+                    backgroundColor: 'transparent',
+                };
+                animation = $.extend({}, defaultParams, animation);
+                animation.startValue = parseFloat(animation.startValue.replace(/,/, '.'));
+                animation.decimalDigitNumber = parseInt(animation.decimalDigitNumber);
+                animation.letterSpacing = parseFloat(animation.letterSpacing);
+
+                var options = {
+                    useEasing: true,
+                    useGrouping: true,
+                    separator: animation.separator,
+                    decimalPlaces: animation.decimalDigitNumber,
+                    decimal: animation.decimalSeparator,
+                    prefix: animation.prefix,
+                    suffix: animation.suffix,
+                    easingFn: function (t, b, c, d) {
+                        var ea = to.ease.split('.');
+                        return b + window[ea[0]][ea[1]].getRatio(t / d) * c
+                    }
+                };
+
+                var css = {
+                    textAlign: animation.align,
+                    letterSpacing: animation.letterSpacing,
+                    opacity: 0,
+                }
+
+                var $this = this;
+                $(this).css(css);
+                var value = parseFloat($(this).text().replace(/,/, '.'));
+                $(this).text('');
+                var countup = new CountUp($(this).attr('id'), value, options);
+                setTimeout(function () {
+                    $($this).css('opacity', 1);
+                    countup.start();
+                }, to.delay * 1000);
             }
 
             $(this).show();
-            TweenMax.fromTo($(this), duration, from, to);
+            if (tweenmax) {
+                TweenMax.fromTo($(this), duration, from, to);
+            }
         });
     },
 

diff --git a/style/fluidbook.less b/style/fluidbook.less
index ab7981c0e6b0dd66d9db34f790e2f508ad71a68f..062c6ca61bea123ede320aff7cb6196370abe881 100644 (file)
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -2,411 +2,411 @@
 
 // See #1773
 use {
-       pointer-events: none;
+  pointer-events: none;
 }
 
 .notransition {
-       transition: none !important;
+  transition: none !important;
 }
 
 /* Screenshot */
 .screenshot .mview {
-       overflow-y: hidden;
+  overflow-y: hidden;
 }
 
 /* Incompatible */
 .no-csstransforms #device {
-       display: none;
+  display: none;
 }
 
 .csstransforms #message {
-       display: none;
+  display: none;
 }
 
 #message {
-       text-align: center;
-       margin: 30px auto;
-       width: 600px;
+  text-align: center;
+  margin: 30px auto;
+  width: 600px;
 }
 
 #message a {
-       text-decoration: underline;
+  text-decoration: underline;
 }
 
 #message a:after {
-       content: " »";
+  content: " »";
 }
 
 /* Disable print div*/
 #printpages {
-       display: none;
+  display: none;
 }
 
 /* Global settings */
 a, input[type=text], input[type=password], input[type=file], input[type=search], input[type=email], textarea {
-       outline: none;
-       -webkit-appearance: none;
+  outline: none;
+  -webkit-appearance: none;
 }
 
 a {
-       text-decoration: none;
-       color: inherit;
+  text-decoration: none;
+  color: inherit;
 }
 
 *::-ms-clear {
-       display: none;
+  display: none;
 }
 
 * {
-       padding: 0;
-       margin: 0;
+  padding: 0;
+  margin: 0;
 
-       box-sizing: border-box;
-       -moz-box-sizing: border-box;
-       -webkit-box-sizing: border-box;
-       -ms-box-sizing: border-box;
-       -o-box-sizing: border-box;
+  box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  -ms-box-sizing: border-box;
+  -o-box-sizing: border-box;
 
-       -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-       -ms-touch-action: double-tap-zoom pinch-zoom;
-       -ms-scroll-chaining: chained;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  -ms-touch-action: double-tap-zoom pinch-zoom;
+  -ms-scroll-chaining: chained;
 
-       -webkit-font-smoothing: antialiased;
+  -webkit-font-smoothing: antialiased;
 }
 
 img {
-       border: 0;
-       box-sizing: content-box;
-       -moz-box-sizing: content-box;
-       -webkit-box-sizing: content-box;
-       -ms-box-sizing: content-box;
-       -o-box-sizing: content-box;
+  border: 0;
+  box-sizing: content-box;
+  -moz-box-sizing: content-box;
+  -webkit-box-sizing: content-box;
+  -ms-box-sizing: content-box;
+  -o-box-sizing: content-box;
 
-       -webkit-user-select: none;
-       -moz-user-select: none;
-       -ms-user-select: none;
-       user-select: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
 }
 
 b, strong, h1, h2, h3, h4, h5, h6 {
-       font-weight: 600;
+  font-weight: 600;
 }
 
 html {
-       user-select: text;
-       -moz-user-select: text;
-       -webkit-user-select: text;
-       -o-user-select: text;
-       -ms-user-select: text;
+  user-select: text;
+  -moz-user-select: text;
+  -webkit-user-select: text;
+  -o-user-select: text;
+  -ms-user-select: text;
 
-       &.ios {
-               position: fixed;
-               top: 0;
-               left: 0;
-       }
+  &.ios {
+    position: fixed;
+    top: 0;
+    left: 0;
+  }
 }
 
 
 body {
-       position: relative;
-       -webkit-touch-callout: none !important;
+  position: relative;
+  -webkit-touch-callout: none !important;
 }
 
 body, input {
-       font-family: @font;
+  font-family: @font;
 }
 
 body.loading * {
-       cursor: progress !important;
+  cursor: progress !important;
 }
 
 html.screenshot #main {
-       visibility: visible !important;
-       display: block !important;
+  visibility: visible !important;
+  display: block !important;
 }
 
 html.screenshot #loader {
-       visibility: hidden !important;
+  visibility: hidden !important;
 }
 
 body, html {
-       overflow-y: hidden;
-       overflow-x: hidden;
-       width: 100%;
-       height: 100%;
-       touch-action: none;
+  overflow-y: hidden;
+  overflow-x: hidden;
+  width: 100%;
+  height: 100%;
+  touch-action: none;
 }
 
 #main {
-       position: relative;
-       display: none;
-       overflow-x: hidden;
-       overflow-y: hidden;
-       visibility: hidden;
-       opacity: 1;
-       z-index: 0;
-       height: 100%;
-       width: 100%;
+  position: relative;
+  display: none;
+  overflow-x: hidden;
+  overflow-y: hidden;
+  visibility: hidden;
+  opacity: 1;
+  z-index: 0;
+  height: 100%;
+  width: 100%;
 }
 
 #main.fadeout, #view.fadeout {
-       transition: opacity 500ms ease-out;
-       opacity: 0;
+  transition: opacity 500ms ease-out;
+  opacity: 0;
 }
 
 #hiddencontents {
-       display: none;
+  display: none;
 }
 
 /* Background */
 #background {
-       position: absolute;
-       left: 0;
-       top: 0;
-       width: 100%;
-       height: 100%;
-       z-index: 0;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 0;
 }
 
 #background .links {
-       position: absolute;
-       width: 100%;
-       height: 100%;
+  position: absolute;
+  width: 100%;
+  height: 100%;
 }
 
 #background .links .link {
-       position: absolute;
+  position: absolute;
 }
 
 /* Orientation */
 .portrait .shade, .portrait .page.right {
-       display: none;
+  display: none;
 }
 
 .portrait .hideOnPortrait {
-       display: none;
+  display: none;
 }
 
 /* Desktop devices */
 
 .msie {
-       &.desktop {
-               #links {
-                       cursor: url(./images/cursors/zoom-in.cur), auto;
-               }
+  &.desktop {
+    #links {
+      cursor: url(./images/cursors/zoom-in.cur), auto;
+    }
 
-               .zoomed {
-                       #links {
-                               cursor: url(./images/cursors/zoom-out.cur), auto;
-                       }
-               }
-       }
+    .zoomed {
+      #links {
+        cursor: url(./images/cursors/zoom-out.cur), auto;
+      }
+    }
+  }
 }
 
 &.no-msie {
-       &.desktop {
-               #links {
-                       cursor: zoom-in;
-               }
+  &.desktop {
+    #links {
+      cursor: zoom-in;
+    }
 
-               .zoomed {
-                       #links {
-                               cursor: zoom-out;
-                       }
-               }
-       }
+    .zoomed {
+      #links {
+        cursor: zoom-out;
+      }
+    }
+  }
 }
 
 #links .link {
-       cursor: auto;
+  cursor: auto;
 
-       &.eventOverlayLink {
-               cursor: inherit;
-       }
+  &.eventOverlayLink {
+    cursor: inherit;
+  }
 
-       iframe {
-               width: 100%;
-               height: 100%;
-               position: absolute;
-               -webkit-transform-origin: 0 0 0;
-               -moz-transform-origin: 0 0 0;
-               -ms-transform-origin: 0 0 0;
-               -o-transform-origin: 0 0 0;
-               transform-origin: 0 0 0;
-       }
+  iframe {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    -webkit-transform-origin: 0 0 0;
+    -moz-transform-origin: 0 0 0;
+    -ms-transform-origin: 0 0 0;
+    -o-transform-origin: 0 0 0;
+    transform-origin: 0 0 0;
+  }
 }
 
 .link {
-       -webkit-transform-origin: 0 0 0;
-       -moz-transform-origin: 0 0 0;
-       -ms-transform-origin: 0 0 0;
-       -o-transform-origin: 0 0 0;
-       transform-origin: 0 0 0;
+  -webkit-transform-origin: 0 0 0;
+  -moz-transform-origin: 0 0 0;
+  -ms-transform-origin: 0 0 0;
+  -o-transform-origin: 0 0 0;
+  transform-origin: 0 0 0;
 
 }
 
 @keyframes loader-spin {
-       0% {
-               transform: rotate(0deg);
-       }
-       100% {
-               transform: rotate(360deg);
-       }
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
 }
 
 /* Loader */
 #loader {
-       position: absolute;
-       @loaderSize: 48px;
-       @loaderMargin: unit(@loaderSize/-2, px);
-       top: 0;
-       left: 0;
-       z-index: 1000;
-       width: @loaderSize;
-       height: @loaderSize;
-       margin: @loaderMargin 0 0 @loaderMargin;
-       display: none;
-
-       svg {
-               width: 100%;
-               height: 100%;
-               fill: @loader-background-color;
-               color: @loader-foreground-color;
-               transform-origin: 50% 50%
-       }
-
-       &.show {
-               display: block;
-
-               svg {
-                       animation-name: loader-spin;
-                       animation-duration: 1s;
-                       animation-iteration-count: infinite;
-                       animation-timing-function: linear;
-               }
-       }
+  position: absolute;
+  @loaderSize: 48px;
+  @loaderMargin: unit(@loaderSize/-2, px);
+  top: 0;
+  left: 0;
+  z-index: 1000;
+  width: @loaderSize;
+  height: @loaderSize;
+  margin: @loaderMargin 0 0 @loaderMargin;
+  display: none;
+
+  svg {
+    width: 100%;
+    height: 100%;
+    fill: @loader-background-color;
+    color: @loader-foreground-color;
+    transform-origin: 50% 50%
+  }
+
+  &.show {
+    display: block;
+
+    svg {
+      animation-name: loader-spin;
+      animation-duration: 1s;
+      animation-iteration-count: infinite;
+      animation-timing-function: linear;
+    }
+  }
 }
 
 /* Pages */
 .background, .texts {
-       pointer-events: none;
-       position: absolute;
-       top: 0px;
-       left: 0px;
-       overflow: visible;
+  pointer-events: none;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  overflow: visible;
 }
 
 .background {
-       background-repeat: no-repeat;
-       width: 100%;
-       height: 100%;
+  background-repeat: no-repeat;
+  width: 100%;
+  height: 100%;
 
-       img {
-               width: unit(@book-page-correct-width, px);
-               height: unit(@book-page-correct-height, px);
-       }
+  img {
+    width: unit(@book-page-correct-width, px);
+    height: unit(@book-page-correct-height, px);
+  }
 }
 
 .texts {
-       img, object {
-               position: absolute;
-               top: 0px;
-               left: 0px;
-               width: 100%;
-               height: 100%;
-       }
+  img, object {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    width: 100%;
+    height: 100%;
+  }
 }
 
 /* Espaces forcés */
 
 #currentDoublePage {
-       pointer-events: none;
+  pointer-events: none;
 }
 
 .page {
-       overflow: hidden;
-       position: absolute;
-       top: 0px;
-       background-color: transparent;
-
-       .texts {
-               position: absolute;
-               top: -1px;
-               left: -1px;
-       }
-
-       .background {
-               position: absolute;
-               top: 0px;
-               left: 0px;
-               width: 100%;
-               height: 100%;
-       }
-
-       .shade {
-               position: absolute;
-               top: 0px;
-       }
-
-       &.right {
-               z-index: 1;
-
-               .shade {
-                       left: 0px;
-               }
-       }
-
-       &.left {
-               .shade {
-                       right: 0px;
-               }
-       }
+  overflow: hidden;
+  position: absolute;
+  top: 0px;
+  background-color: transparent;
+
+  .texts {
+    position: absolute;
+    top: -1px;
+    left: -1px;
+  }
+
+  .background {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    width: 100%;
+    height: 100%;
+  }
+
+  .shade {
+    position: absolute;
+    top: 0px;
+  }
+
+  &.right {
+    z-index: 1;
+
+    .shade {
+      left: 0px;
+    }
+  }
+
+  &.left {
+    .shade {
+      right: 0px;
+    }
+  }
 }
 
 .doublePage, #pages {
-       position: absolute;
-       top: 0px;
-       left: 0px;
-       overflow: hidden;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  overflow: hidden;
 }
 
 /* Search */
 #searchHighlights {
-       position: absolute;
-       top: 0px;
-       left: 0px;
-       z-index: 3;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  z-index: 3;
 
-       .highlight {
-               position: absolute;
-               border-width: 2px;
-               border-radius: 2px;
-               border-style: solid;
+  .highlight {
+    position: absolute;
+    border-width: 2px;
+    border-radius: 2px;
+    border-style: solid;
 
-               -webkit-transform-origin: 0 0;
-               -moz-transform-origin: 0 0;
-               transform-origin: 0 0;
+    -webkit-transform-origin: 0 0;
+    -moz-transform-origin: 0 0;
+    transform-origin: 0 0;
 
-               &[data-color="0"], &[data-color="5"], &[data-color="10"] {
-                       .highlight-area(#00ff00);
-               }
+    &[data-color="0"], &[data-color="5"], &[data-color="10"] {
+      .highlight-area(#00ff00);
+    }
 
-               &[data-color="1"], &[data-color="6"], &[data-color="11"] {
-                       .highlight-area(#ffff00);
-               }
+    &[data-color="1"], &[data-color="6"], &[data-color="11"] {
+      .highlight-area(#ffff00);
+    }
 
-               &[data-color="2"], &[data-color="7"], &[data-color="12"] {
-                       .highlight-area(#00ffff);
-               }
+    &[data-color="2"], &[data-color="7"], &[data-color="12"] {
+      .highlight-area(#00ffff);
+    }
 
-               &[data-color="3"], &[data-color="8"], &[data-color="13"] {
-                       .highlight-area(#ff00ff);
-               }
+    &[data-color="3"], &[data-color="8"], &[data-color="13"] {
+      .highlight-area(#ff00ff);
+    }
 
-               &[data-color="4"], &[data-color="9"], &[data-color="14"] {
-                       .highlight-area(#ff0000);
-               }
-       }
+    &[data-color="4"], &[data-color="9"], &[data-color="14"] {
+      .highlight-area(#ff0000);
+    }
+  }
 }
 
 /* Shadow */
@@ -414,225 +414,225 @@ body, html {
 @shadow-height: 120px;
 @shadow-offset: 0px;
 #shadow {
-       @shadow-width-left: @book-page-width+12;
-       @shadow-width-right: @book-page-width+12;
-       position: absolute;
-       top: 0px;
-       left: 0px;
-       width: unit(@shadow-width-left+@shadow-width-right, px);
-       height: unit(@book-page-height, px);
-       pointer-events: none;
-       mix-blend-mode: multiply;
-
-       transition-property: none !important;
-       transition-duration: 0ms !important;
-
-       > .shadow {
-               position: absolute;
-               left: 0;
-               opacity: @shadow-opacity;
-               .shadowedge-fade-item();
-
-               &.bottom {
-                       bottom: -@shadow-height+@shadow-offset;
-                       background-size: 100% @shadow-height;
-                       height: @shadow-height;
-
-                       .portrait & {
-                               opacity: @shadow-opacity/2;
-                       }
-
-                       &.left {
-                               left: -12px;
-                               width: @shadow-width-left;
-                               background-image: url("../images/shadows/back/bottom-left.png");
-                       }
-
-                       &.right {
-                               background-image: url("../images/shadows/back/bottom-right.png");
-                               width: @shadow-width-right;
-
-                               .landscape & {
-                                       left: @book-page-width;
-                               }
-                       }
-               }
-
-               &.side {
-                       top: 0;
-                       width: 35px;
-                       height: unit(@book-page-height, px);
-                       background-size: 100% 100%;
-
-                       &.right {
-                               left: unit(@book-page-width*2, px);
-                               background-image: url("../images/shadows/back/right.png");
-
-                               .portrait & {
-                                       display: block !important;
-                                       left: unit(@book-page-width - 6, px);
-                               }
-                       }
-
-                       &.left {
-                               background-image: url("../images/shadows/back/left.png");
-                               left: -35px;
-
-                               .portrait & {
-                                       left: -29px;
-                               }
-                       }
-
-               }
-       }
+  @shadow-width-left: @book-page-width+12;
+  @shadow-width-right: @book-page-width+12;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  width: unit(@shadow-width-left+@shadow-width-right, px);
+  height: unit(@book-page-height, px);
+  pointer-events: none;
+  mix-blend-mode: multiply;
+
+  transition-property: none !important;
+  transition-duration: 0ms !important;
+
+  > .shadow {
+    position: absolute;
+    left: 0;
+    opacity: @shadow-opacity;
+    .shadowedge-fade-item();
+
+    &.bottom {
+      bottom: -@shadow-height+@shadow-offset;
+      background-size: 100% @shadow-height;
+      height: @shadow-height;
+
+      .portrait & {
+        opacity: @shadow-opacity/2;
+      }
+
+      &.left {
+        left: -12px;
+        width: @shadow-width-left;
+        background-image: url("../images/shadows/back/bottom-left.png");
+      }
+
+      &.right {
+        background-image: url("../images/shadows/back/bottom-right.png");
+        width: @shadow-width-right;
+
+        .landscape & {
+          left: @book-page-width;
+        }
+      }
+    }
+
+    &.side {
+      top: 0;
+      width: 35px;
+      height: unit(@book-page-height, px);
+      background-size: 100% 100%;
+
+      &.right {
+        left: unit(@book-page-width*2, px);
+        background-image: url("../images/shadows/back/right.png");
+
+        .portrait & {
+          display: block !important;
+          left: unit(@book-page-width - 6, px);
+        }
+      }
+
+      &.left {
+        background-image: url("../images/shadows/back/left.png");
+        left: -35px;
+
+        .portrait & {
+          left: -29px;
+        }
+      }
+
+    }
+  }
 }
 
 #edges {
-       transition-property: none !important;
-       transition-duration: 0ms !important;
-
-       position: absolute;
-       top: 0px;
-       left: 0px;
-       width: unit(@book-page-width*2, px);
-       height: unit(@book-page-height, px);
-       pointer-events: none;
-       .hideifnot(@edges-display);
-
-       .portrait & {
-               width: unit(@book-page-width, px);
-       }
-
-       @edge-scale: 1;
-
-       > .edge {
-               .shadowedge-fade-item();
-               position: absolute;
-               top: 0;
-               height: 100%;
-
-               > div {
-                       background-size: 100% 100%;
-                       position: absolute;
-                       background-repeat: no-repeat;
-               }
-
-               .top {
-                       top: 0;
-                       height: unit(12*@edge-scale, px);
-               }
-
-               .bottom {
-                       bottom: 0;
-                       height: unit(22*@edge-scale, px);
-               }
-
-               .middle {
-                       top: unit(12*@edge-scale, px);
-                       bottom: unit(22*@edge-scale, px);
-               }
-
-               &.left {
-                       left: unit(-17*@edge-scale, px);
-                       width: unit(17*@edge-scale, px);
-
-                       div {
-                               width: unit(17*@edge-scale, px);
-                       }
-
-                       .top {
-                               background-image: url("../images/edges/edge-left-top.png");
-                       }
-
-                       .bottom {
-                               background-image: url("../images/edges/edge-left-bottom.png");
-                       }
-
-                       .middle {
-                               background-image: url("../images/edges/edge-left-middle.png");
-                       }
-               }
-
-               &.right {
-                       right: unit(-11*@edge-scale, px);
-                       width: unit(11*@edge-scale, px);
-
-                       div {
-                               width: unit(11*@edge-scale, px);
-                       }
-
-                       .top {
-                               background-image: url("../images/edges/edge-right-top.png");
-                       }
-
-                       .bottom {
-                               background-image: url("../images/edges/edge-right-bottom.png");
-                       }
-
-                       .middle {
-                               background-image: url("../images/edges/edge-right-middle.png");
-                       }
-               }
-       }
+  transition-property: none !important;
+  transition-duration: 0ms !important;
+
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  width: unit(@book-page-width*2, px);
+  height: unit(@book-page-height, px);
+  pointer-events: none;
+  .hideifnot(@edges-display);
+
+  .portrait & {
+    width: unit(@book-page-width, px);
+  }
+
+  @edge-scale: 1;
+
+  > .edge {
+    .shadowedge-fade-item();
+    position: absolute;
+    top: 0;
+    height: 100%;
+
+    > div {
+      background-size: 100% 100%;
+      position: absolute;
+      background-repeat: no-repeat;
+    }
+
+    .top {
+      top: 0;
+      height: unit(12*@edge-scale, px);
+    }
+
+    .bottom {
+      bottom: 0;
+      height: unit(22*@edge-scale, px);
+    }
+
+    .middle {
+      top: unit(12*@edge-scale, px);
+      bottom: unit(22*@edge-scale, px);
+    }
+
+    &.left {
+      left: unit(-17*@edge-scale, px);
+      width: unit(17*@edge-scale, px);
+
+      div {
+        width: unit(17*@edge-scale, px);
+      }
+
+      .top {
+        background-image: url("../images/edges/edge-left-top.png");
+      }
+
+      .bottom {
+        background-image: url("../images/edges/edge-left-bottom.png");
+      }
+
+      .middle {
+        background-image: url("../images/edges/edge-left-middle.png");
+      }
+    }
+
+    &.right {
+      right: unit(-11*@edge-scale, px);
+      width: unit(11*@edge-scale, px);
+
+      div {
+        width: unit(11*@edge-scale, px);
+      }
+
+      .top {
+        background-image: url("../images/edges/edge-right-top.png");
+      }
+
+      .bottom {
+        background-image: url("../images/edges/edge-right-bottom.png");
+      }
+
+      .middle {
+        background-image: url("../images/edges/edge-right-middle.png");
+      }
+    }
+  }
 }
 
 /* Locale Flag icon */
 .locale-flag {
-       display: inline-block;
-       width: 22px;
-       height: 17px;
-       border-radius: 1px;
-       background-position: 50% 50%;
-       background-repeat: no-repeat;
-       margin: 0 18px 4px;
+  display: inline-block;
+  width: 22px;
+  height: 17px;
+  border-radius: 1px;
+  background-position: 50% 50%;
+  background-repeat: no-repeat;
+  margin: 0 18px 4px;
 
-       #menu & {
-               padding: 0;
-               margin: 0 10px 0 0;
-       }
+  #menu & {
+    padding: 0;
+    margin: 0 10px 0 0;
+  }
 }
 
 .localesList {
-       li {
-               a {
-                       padding: 10px 20px !important;
+  li {
+    a {
+      padding: 10px 20px !important;
 
-                       img {
-                               vertical-align: middle;
-                               margin: -2px 0 0 0;
-                       }
+      img {
+        vertical-align: middle;
+        margin: -2px 0 0 0;
+      }
 
-                       span {
-                               display: inline-block !important;
-                               padding: 0 12px !important;
-                       }
-               }
-       }
+      span {
+        display: inline-block !important;
+        padding: 0 12px !important;
+      }
+    }
+  }
 }
 
 @zoomtransition: 350ms;
 @zoomtransitioninertia: 400ms;
 
 #z {
-       position: absolute;
-       z-index: 11;
-       direction: ltr;
-       top: 0;
-       left: 0;
+  position: absolute;
+  z-index: 11;
+  direction: ltr;
+  top: 0;
+  left: 0;
 
-       transition: transform @zoomtransition ease-out;
+  transition: transform @zoomtransition ease-out;
 
-       &.notransition {
-               transition: none;
-       }
+  &.notransition {
+    transition: none;
+  }
 
-       &.transition-inertia {
-               transition: transform-origin @zoomtransitioninertia ease-out;
-       }
+  &.transition-inertia {
+    transition: transform-origin @zoomtransitioninertia ease-out;
+  }
 
-       &.nozoom {
-               height: 0 !important;
-       }
+  &.nozoom {
+    height: 0 !important;
+  }
 }
 
 @import "slider";
@@ -640,2269 +640,2275 @@ body, html {
 /* Center */
 
 #center-fluidbook, #center-shadow {
-       position: absolute;
-       top: 0;
-       left: 0;
+  position: absolute;
+  top: 0;
+  left: 0;
 
-       &.animate {
-               .page-transition(0.7);
-       }
+  &.animate {
+    .page-transition(0.7);
+  }
 }
 
 /* Fluidbook */
 #fluidbook {
-       position: absolute;
-       z-index: 11;
-       direction: ltr;
+  position: absolute;
+  z-index: 11;
+  direction: ltr;
 
-       &.animate {
-               transition: all @zoomtransition ease-out;
-       }
+  &.animate {
+    transition: all @zoomtransition ease-out;
+  }
 }
 
 #cache {
-       display: none;
+  display: none;
 }
 
 #pagesnumbers {
-       padding: 0;
-       position: absolute;
-       white-space: nowrap;
-       pointer-events: none;
-       font-size: unit(13*@z, px);
-       margin: 0.12em 0 0 0;
-       top: @book-page-height;
-       color: @page-number-color;
-       .hideifnot(@display-page-number);
-       opacity: 1;
-
-       &.hidden {
-               transition: none;
-               opacity: 0;
-       }
-
-       > div {
-               width: @book-page-width;
-               text-align: center;
-               display: inline-block;
-       }
+  padding: 0;
+  position: absolute;
+  white-space: nowrap;
+  pointer-events: none;
+  font-size: unit(13*@z, px);
+  margin: 0.12em 0 0 0;
+  top: @book-page-height;
+  color: @page-number-color;
+  .hideifnot(@display-page-number);
+  opacity: 1;
+
+  &.hidden {
+    transition: none;
+    opacity: 0;
+  }
+
+  > div {
+    width: @book-page-width;
+    text-align: center;
+    display: inline-block;
+  }
 }
 
 .portrait #pagesnumbers .right {
-       display: none;
+  display: none;
 }
 
 @import "interface";
 
 /* Header */
 header {
-       position: relative;
-       z-index: 12;
+  position: relative;
+  z-index: 12;
 
-       // Header should sit above help overlay when it is open
-       .help & {
-               z-index: 21;
-               background-color: transparent; // Disable background so icons are visible
-       }
+  // Header should sit above help overlay when it is open
+  .help & {
+    z-index: 21;
+    background-color: transparent; // Disable background so icons are visible
+  }
 
-       // Bug #2159
-       .menu-burger .landscape & {
-               z-index: 10;
-       }
+  // Bug #2159
+  .menu-burger .landscape & {
+    z-index: 10;
+  }
 }
 
 #nav > a {
-       vertical-align: top;
-       display: inline-block;
+  vertical-align: top;
+  display: inline-block;
 
-       &.hidden {
-               display: none;
-       }
+  &.hidden {
+    display: none;
+  }
 }
 
 #nav a {
-       padding: 0 10px 20px 10px;
+  padding: 0 10px 20px 10px;
 }
 
 .ltr #nav a#submitSearch {
-       margin: 0 0 0 5px;
+  margin: 0 0 0 5px;
 }
 
 .rtl #nav a#submitSearch {
-       margin: 0 5px 0 0;
+  margin: 0 5px 0 0;
 }
 
 #nav > a > img {
-       padding: 10px 2px 0px 2px;
-       vertical-align: top;
+  padding: 10px 2px 0px 2px;
+  vertical-align: top;
 }
 
 #nav {
-       position: relative;
-       white-space: nowrap;
+  position: relative;
+  white-space: nowrap;
 
-       #locales {
-               background-color: @icon-color;
-       }
+  #locales {
+    background-color: @icon-color;
+  }
 }
 
 input[type="search"]::-webkit-search-decoration,
 input[type="search"]::-webkit-search-cancel-button,
 input[type="search"]::-webkit-search-results-button,
 input[type="search"]::-webkit-search-results-decoration {
-       display: none;
+  display: none;
 }
 
 .hint {
-       padding: 2px 5px 5px;
-       height: 22px;
-       width: 137px;
-       margin: 2px;
-       display: block;
-       font-size: 12px;
+  padding: 2px 5px 5px;
+  height: 22px;
+  width: 137px;
+  margin: 2px;
+  display: block;
+  font-size: 12px;
 }
 
 #searchHints {
-       border-radius: 1px;
-       width: 150px;
-       padding: 5px;
-       display: none;
-       z-index: 25;
-       position: absolute;
+  border-radius: 1px;
+  width: 150px;
+  padding: 5px;
+  display: none;
+  z-index: 25;
+  position: absolute;
 }
 
 #logo {
-       position: absolute;
-       top: 0px;
-       background-repeat: no-repeat;
-       z-index: 10;
-
-       &.hidden {
-               visibility: hidden;
-               pointer-events: none;
-       }
-
-       &.overridenByFluidbook, .help & {
-               visibility: hidden;
-       }
-
-       // Positioning for left-to-right Fluidbooks + inverted menu on RTL
-       .ltr &, .rtl.menu-inverted & {
-               right: 0;
-               left: auto;
-               transform-origin: 100% 0; // Top right transform origin so positioning is correct after scaling
-       }
-
-       // Positioning for right-to-left Fluidbooks + inverted menu on LTR
-       .rtl &, .ltr.menu-inverted & {
-               left: 0;
-               right: auto;
-               transform-origin: 0 0; // Top left transform origin so positioning is correct after scaling
-       }
+  position: absolute;
+  top: 0px;
+  background-repeat: no-repeat;
+  z-index: 10;
+
+  &.hidden {
+    visibility: hidden;
+    pointer-events: none;
+  }
+
+  &.overridenByFluidbook, .help & {
+    visibility: hidden;
+  }
+
+  // Positioning for left-to-right Fluidbooks + inverted menu on RTL
+  .ltr &, .rtl.menu-inverted & {
+    right: 0;
+    left: auto;
+    transform-origin: 100% 0; // Top right transform origin so positioning is correct after scaling
+  }
+
+  // Positioning for right-to-left Fluidbooks + inverted menu on LTR
+  .rtl &, .ltr.menu-inverted & {
+    left: 0;
+    right: auto;
+    transform-origin: 0 0; // Top left transform origin so positioning is correct after scaling
+  }
 }
 
 /* Credits */
 footer {
-       font-family: @font;
-       font-size: 8px;
-       text-transform: uppercase;
-       position: absolute;
-       bottom: 2px;
-       z-index: 20;
-       transform-origin: 100% 100%;
+  font-family: @font;
+  font-size: 8px;
+  text-transform: uppercase;
+  position: absolute;
+  bottom: 2px;
+  z-index: 20;
+  transform-origin: 100% 100%;
 }
 
 footer a {
-       display: inline-block;
-       text-decoration: none;
-       transform-origin: 100% 100%;
-       transform: scale(1.08, 0.95) !important;
+  display: inline-block;
+  text-decoration: none;
+  transform-origin: 100% 100%;
+  transform: scale(1.08, 0.95) !important;
 }
 
 .ltr footer {
-       right: 4px;
+  right: 4px;
 }
 
 .rtl footer {
-       left: 4px;
+  left: 4px;
 }
 
 /* Fluidbook zooming */
 
 footer, header, #interface {
-       transition: opacity 400ms ease-in, visibility 400ms ease-in;
+  transition: opacity 400ms ease-in, visibility 400ms ease-in;
 
-       .ios & {
-               transition: none;
-       }
+  .ios & {
+    transition: none;
+  }
 
-       &.hidden {
-               visibility: hidden;
-               opacity: 0;
-               z-index: 0;
-       }
+  &.hidden {
+    visibility: hidden;
+    opacity: 0;
+    z-index: 0;
+  }
 }
 
 #shadow {
-       @shadow-zoom-transition: 400ms;
+  @shadow-zoom-transition: 400ms;
 
-       transition: opacity @shadow-zoom-transition ease-in, visibility @shadow-zoom-transition ease-in;
+  transition: opacity @shadow-zoom-transition ease-in, visibility @shadow-zoom-transition ease-in;
 
-       &.animate {
-               transition: all @zoomtransition ease-out;
-       }
+  &.animate {
+    transition: all @zoomtransition ease-out;
+  }
 
-       .ios & {
-               transition: none !important;
-       }
+  .ios & {
+    transition: none !important;
+  }
 
-       &.hidden {
-               visibility: hidden;
-               opacity: 0;
-               z-index: 0;
-       }
+  &.hidden {
+    visibility: hidden;
+    opacity: 0;
+    z-index: 0;
+  }
 
 }
 
 a.bookmark {
-       &.hidden {
-               visibility: hidden;
-       }
+  &.hidden {
+    visibility: hidden;
+  }
 }
 
 /* Cart */
 .icon-cart {
-       position: relative;
-
-       span.number {
-               position: absolute;
-               top: 0.7em;
-               left: 0;
-               color: @icon-color;
-               text-align: center;
-               width: 100%;
-               font-size: 0.7em;
-       }
-
-       &#menu_cart {
-               span.number {
-                       width: auto;
-                       top: 14px;
-                       left: 39px;
-               }
-       }
+  position: relative;
+
+  span.number {
+    position: absolute;
+    top: 0.7em;
+    left: 0;
+    color: @icon-color;
+    text-align: center;
+    width: 100%;
+    font-size: 0.7em;
+  }
+
+  &#menu_cart {
+    span.number {
+      width: auto;
+      top: 14px;
+      left: 39px;
+    }
+  }
 }
 
 [data-menu="cart"] {
-       .cart-empty {
-               padding: 50px;
-       }
-
-       &.fs {
-               table {
-                       td {
-                               &.name {
-                                       width: 100%;
-
-                                       .m {
-                                               display: block;
-                                       }
-                               }
-
-                               &.price, &.price_excluding_taxes, &.price_unit {
-                                       display: none;
-                               }
-                       }
-               }
-
-               .cart-footer {
-                       clear: both;
-                       width: 100%;
-                       text-align: left;
-                       position: relative;
-                       top: -40px;
-
-                       p {
-                               float: none;
-                               width: 100%;
-                               font-size: 0.8em;
-                               padding: 0 30px 30px;
-                               margin: 0;
-                       }
-
-                       .fonctions {
-                               float: none;
-                               width: 100%;
-                       }
-               }
-
-               .cart-shipping-form {
-                       margin-top: 30px;
-
-                       .col {
-                               &.col-left, &.col-right {
-                                       width: 100%;
-                                       left: 0;
-                                       margin-top: 0;
-                                       margin-right: 0;
-                                       padding: 0 30px;
-                               }
-                       }
-
-                       .cart-footer {
-                               top: 0;
-                       }
-               }
-
-       }
-
-       table {
-               width: 100%;
-               max-width: 1004px;
-               margin-left: 10px;
-
-               td {
-                       padding: 15px;
-                       text-align: left;
-                       vertical-align: middle;
-                       white-space: nowrap;
-
-                       &.name {
-                               white-space: normal;
-
-                               .m {
-                                       display: none;
-                               }
-                       }
-
-                       &.price {
-                               font-weight: 700;
-                       }
-
-                       &.price, &.price_excluding_taxes, &.price_unit {
-                               text-align: right;
-                       }
-
-                       &.delete {
-                               a {
-                                       display: inline-block;
-                                       width: 23px;
-                                       height: 23px;
-                                       background-color: @menu-button-background;
-                                       position: relative;
-                                       top: 1px;
-                                       left: -5px;
-                                       padding: 0 6px;
-
-                                       svg {
-                                               width: 11px;
-                                               height: 11px;
-                                               display: inline-block;
-                                       }
-                               }
-                       }
-               }
-
-               .input-number {
-                       position: relative;
-                       width: 170px;
-                       height: 44px;
-
-                       input {
-                               height: 44px;
-                               width: 70px;
-                               display: inline-block;
-                               margin: 0 2px;
-                               border: 0;
-                               vertical-align: top;
-                               padding: 20px;
-                               text-align: center;
-                       }
-
-                       a {
-                               display: inline-block;
-                               height: 44px;
-                               width: 44px;
-                               background-color: @menu-button-background;
-                               text-align: center;
-                               font-weight: 700;
-                               font-size: 30px;
-                       }
-               }
-
-               &.cart-totals {
-                       width: 250px;
-                       margin: 18px 18px 50px;
-                       float: right;
-                       clear: both;
-
-                       td.hr {
-                               height: 2px;
-                               background-color: #fff;
-                               padding: 0;
-                       }
-
-                       tr.total {
-                               td {
-                                       font-weight: 700;
-
-                               }
-                       }
-
-                       td {
-                               padding: 6px 12px;
-                               text-align: right;
-                       }
-               }
-       }
-
-       .cart-footer {
-               clear: both;
-               width: 100%;
-               text-align: left;
-
-               p {
-                       float: left;
-                       width: 450px;
-                       font-size: 0.8em;
-                       margin-top: 10px;
-                       margin-left: 30px;
-               }
-
-               .fonctions {
-                       float: right;
-                       width: 450px;
-               }
-       }
-
-       .cart-shipping-form {
-               .col {
-                       width: 441px;
-                       margin-top: 30px;
-                       display: inline-block;
-                       text-align: left;
-                       position: relative;
-
-                       input {
-                               width: 100%;
-                               padding: 18px 15px;
-                               background-color: #fff;
-                               margin-bottom: 25px;
-                               font-size: 1.1em;
-                               border: 2px solid #fff;
-
-                               &.parsley-error {
-                                       border-color: #cc0000;
-                               }
-                       }
-
-                       p {
-                               text-align: left;
-                               padding: 15px 10px 15px 10px;
-                       }
-
-                       &.col-left {
-                               left: -5px;
-                               margin-right: 80px;
-                       }
-               }
-
-               .cart-footer {
-                       margin-top: 10px;
-               }
-
-               .parsley-errors-list {
-                       display: none;
-               }
-       }
-
-       .cart-confirmation {
-               margin: 50px 0;
-               text-align: left;
-               padding: 0 30px;
-       }
+  .cart-empty {
+    padding: 50px;
+  }
+
+  &.fs {
+    table {
+      td {
+        &.name {
+          width: 100%;
+
+          .m {
+            display: block;
+          }
+        }
+
+        &.price, &.price_excluding_taxes, &.price_unit {
+          display: none;
+        }
+      }
+    }
+
+    .cart-footer {
+      clear: both;
+      width: 100%;
+      text-align: left;
+      position: relative;
+      top: -40px;
+
+      p {
+        float: none;
+        width: 100%;
+        font-size: 0.8em;
+        padding: 0 30px 30px;
+        margin: 0;
+      }
+
+      .fonctions {
+        float: none;
+        width: 100%;
+      }
+    }
+
+    .cart-shipping-form {
+      margin-top: 30px;
+
+      .col {
+        &.col-left, &.col-right {
+          width: 100%;
+          left: 0;
+          margin-top: 0;
+          margin-right: 0;
+          padding: 0 30px;
+        }
+      }
+
+      .cart-footer {
+        top: 0;
+      }
+    }
+
+  }
+
+  table {
+    width: 100%;
+    max-width: 1004px;
+    margin-left: 10px;
+
+    td {
+      padding: 15px;
+      text-align: left;
+      vertical-align: middle;
+      white-space: nowrap;
+
+      &.name {
+        white-space: normal;
+
+        .m {
+          display: none;
+        }
+      }
+
+      &.price {
+        font-weight: 700;
+      }
+
+      &.price, &.price_excluding_taxes, &.price_unit {
+        text-align: right;
+      }
+
+      &.delete {
+        a {
+          display: inline-block;
+          width: 23px;
+          height: 23px;
+          background-color: @menu-button-background;
+          position: relative;
+          top: 1px;
+          left: -5px;
+          padding: 0 6px;
+
+          svg {
+            width: 11px;
+            height: 11px;
+            display: inline-block;
+          }
+        }
+      }
+    }
+
+    .input-number {
+      position: relative;
+      width: 170px;
+      height: 44px;
+
+      input {
+        height: 44px;
+        width: 70px;
+        display: inline-block;
+        margin: 0 2px;
+        border: 0;
+        vertical-align: top;
+        padding: 20px;
+        text-align: center;
+      }
+
+      a {
+        display: inline-block;
+        height: 44px;
+        width: 44px;
+        background-color: @menu-button-background;
+        text-align: center;
+        font-weight: 700;
+        font-size: 30px;
+      }
+    }
+
+    &.cart-totals {
+      width: 250px;
+      margin: 18px 18px 50px;
+      float: right;
+      clear: both;
+
+      td.hr {
+        height: 2px;
+        background-color: #fff;
+        padding: 0;
+      }
+
+      tr.total {
+        td {
+          font-weight: 700;
+
+        }
+      }
+
+      td {
+        padding: 6px 12px;
+        text-align: right;
+      }
+    }
+  }
+
+  .cart-footer {
+    clear: both;
+    width: 100%;
+    text-align: left;
+
+    p {
+      float: left;
+      width: 450px;
+      font-size: 0.8em;
+      margin-top: 10px;
+      margin-left: 30px;
+    }
+
+    .fonctions {
+      float: right;
+      width: 450px;
+    }
+  }
+
+  .cart-shipping-form {
+    .col {
+      width: 441px;
+      margin-top: 30px;
+      display: inline-block;
+      text-align: left;
+      position: relative;
+
+      input {
+        width: 100%;
+        padding: 18px 15px;
+        background-color: #fff;
+        margin-bottom: 25px;
+        font-size: 1.1em;
+        border: 2px solid #fff;
+
+        &.parsley-error {
+          border-color: #cc0000;
+        }
+      }
+
+      p {
+        text-align: left;
+        padding: 15px 10px 15px 10px;
+      }
+
+      &.col-left {
+        left: -5px;
+        margin-right: 80px;
+      }
+    }
+
+    .cart-footer {
+      margin-top: 10px;
+    }
+
+    .parsley-errors-list {
+      display: none;
+    }
+  }
+
+  .cart-confirmation {
+    margin: 50px 0;
+    text-align: left;
+    padding: 0 30px;
+  }
 }
 
 // Hack for #1433
 html.ios body.portrait #interface {
-       transition: none;
+  transition: none;
 }
 
 /* Links */
 #links {
-       position: absolute;
-       top: 0px;
-       left: 0px;
-       z-index: 4;
-       background-color: rgba(0, 0, 0, 0.001);
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  z-index: 4;
+  background-color: rgba(0, 0, 0, 0.001);
 }
 
 .rtl #pages.double #links {
-       .leftContainer {
-               position: relative;
-               left: 50%;
-       }
+  .leftContainer {
+    position: relative;
+    left: 50%;
+  }
 
-       .rightContainer {
-               position: relative;
-               left: -50%;
-       }
+  .rightContainer {
+    position: relative;
+    left: -50%;
+  }
 }
 
 #links .link {
-       position: absolute;
-       cursor: auto;
+  position: absolute;
+  cursor: auto;
 }
 
 .link.multimedia {
-       position: absolute;
-       -ms-touch-action: manipulation;
-       touch-action: manipulation;
+  position: absolute;
+  -ms-touch-action: manipulation;
+  touch-action: manipulation;
 
-       // Fix #2551
-       overflow: hidden;
+  // Fix #2551
+  overflow: hidden;
 
-       // Fix #2556
-       &.tabslink {
-               overflow: visible;
-       }
+  // Fix #2556
+  &.tabslink {
+    overflow: visible;
+  }
 
-       &.notinteractive {
-               pointer-events: none;
-       }
+  &.notinteractive {
+    pointer-events: none;
+  }
 
-       // Force images to take space provided (see: https://team.cubedesigners.com/redmine/issues/1457)
-       > img.multimediaimage {
-               width: 100%;
-               height: 100%;
-       }
+  // Force images to take space provided (see: https://team.cubedesigners.com/redmine/issues/1457)
+  > img.multimediaimage {
+    width: 100%;
+    height: 100%;
+  }
 }
 
 .link {
-       &[data-hidden="1"] {
-               transition: opacity 1s;
-               display: none;
-               opacity: 0;
+  &[data-hidden="1"] {
+    transition: opacity 1s;
+    display: none;
+    opacity: 0;
 
-               &.show {
-                       opacity: 1;
-               }
-       }
+    &.show {
+      opacity: 1;
+    }
+  }
 }
 
 .link.contentLink {
-       z-index: 0 !important;
-       position: absolute;
-       pointer-events: none;
+  z-index: 0 !important;
+  position: absolute;
+  pointer-events: none;
 
-       &[data-animation-type="reveal"], &[data-animation-type="fadein"] {
-               display: none;
-       }
+  &[data-animation-type="reveal"], &[data-animation-type="fadein"] {
+    display: none;
+  }
+
+  &.textLink {
+    white-space: nowrap;
+    opacity: 0;
+  }
 }
 
 @links-area-color: fadeout(@links-color, 70%);
 .link a {
-       width: 100%;
-       height: 100%;
-       display: block;
-       background-color: transparent;
+  width: 100%;
+  height: 100%;
+  display: block;
+  background-color: transparent;
 
-       &.displayArea {
-               -webkit-tap-highlight-color: @links-area-color;
-               background-color: fadeout(@links-color, 99.999%);
+  &.displayArea {
+    -webkit-tap-highlight-color: @links-area-color;
+    background-color: fadeout(@links-color, 99.999%);
 
-               &.animating {
-                       background-color: @links-area-color;
-               }
+    &.animating {
+      background-color: @links-area-color;
+    }
 
-               .no-ftouch &:hover {
-                       opacity: 1 !important;
-                       background-color: @links-area-color;
-               }
-       }
+    .no-ftouch &:hover {
+      opacity: 1 !important;
+      background-color: @links-area-color;
+    }
+  }
 }
 
 #links .nonlinkarea {
-       width: 100%;
-       height: 100%;
-       position: absolute;
-       top: 0px;
-       left: 0px;
-       display: block;
-       cursor: zoom-in;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  display: block;
+  cursor: zoom-in;
 }
 
 /* Bookmarks */
 .bookmark {
-       #links & {
-               z-index: 4999;
-               width: @bookmark-corner-size;
-               height: @bookmark-corner-size;
-               background-size: @bookmark-corner-size @bookmark-corner-size;
-
-               &.left {
-                       left: @bookmark-corner-offset;
-
-                       .portrait #fluidbook & {
-                               right: @bookmark-corner-offset+@book-page-width;
-                               left: auto;
-                       }
-               }
-
-               &.right {
-                       right: @bookmark-corner-offset;
-               }
-       }
-
-       svg {
-               color: @bookmark-star-disabled-color;
-       }
-
-       &[data-enabled] {
-               svg {
-                       color: @bookmark-star-enabled-color;
-               }
-       }
-
-       background-repeat: no-repeat;
-       position: absolute;
-       background-size: cover;
-       top: 0px;
-       opacity: 0.01;
-       display: block;
-       cursor: pointer;
-
-       &[data-enabled], &:hover {
-               opacity: 1 !important;
-               transition: none;
-       }
+  #links & {
+    z-index: 4999;
+    width: @bookmark-corner-size;
+    height: @bookmark-corner-size;
+    background-size: @bookmark-corner-size @bookmark-corner-size;
+
+    &.left {
+      left: @bookmark-corner-offset;
+
+      .portrait #fluidbook & {
+        right: @bookmark-corner-offset+@book-page-width;
+        left: auto;
+      }
+    }
+
+    &.right {
+      right: @bookmark-corner-offset;
+    }
+  }
+
+  svg {
+    color: @bookmark-star-disabled-color;
+  }
+
+  &[data-enabled] {
+    svg {
+      color: @bookmark-star-enabled-color;
+    }
+  }
+
+  background-repeat: no-repeat;
+  position: absolute;
+  background-size: cover;
+  top: 0px;
+  opacity: 0.01;
+  display: block;
+  cursor: pointer;
+
+  &[data-enabled], &:hover {
+    opacity: 1 !important;
+    transition: none;
+  }
 }
 
 .bookmark.left {
-       left: 0;
+  left: 0;
 }
 
 .bookmark.right,
 .portrait #fluidbook .bookmark.left {
-       right: 0;
+  right: 0;
 
-       svg {
-               transform: scaleX(-1);
-       }
+  svg {
+    transform: scaleX(-1);
+  }
 }
 
 .landscape .bookmark.left {
-       left: 0px;
+  left: 0px;
 }
 
 .bookmark.right {
-       right: 0px;
+  right: 0px;
 }
 
 @menu-padding: 30px;
 
 /* View */
 #viewOverlay {
-       position: absolute;
-       top: 0;
-       left: 0;
-       width: 100%;
-       height: 100%;
-       z-index: 21;
-       cursor: pointer; // Needed or click events don't work on iOS (see: https://stackoverflow.com/a/16006333)
-       .overlayBackground();
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 21;
+  cursor: pointer; // Needed or click events don't work on iOS (see: https://stackoverflow.com/a/16006333)
+  .overlayBackground();
 }
 
 #view, #viewOverlay {
-       visibility: hidden;
+  visibility: hidden;
 }
 
 .mview {
-       .menu-color(@menu-background, @menu-button-background);
-       color: @menu-text;
-       position: absolute;
-       top: 0;
-       left: 0;
-       z-index: 22;
-       display: none;
-       overflow: hidden;
-       background-repeat: no-repeat;
-       background-size: 100% 100%;
-       max-width: 600px;
-       width: 100%;
-
-       @menutransition: 400ms;
-
-       transition: opacity @menutransition, top @menutransition;
-
-       &[data-menu="multimedia"], &[data-menu="webvideo"], &[data-menu="video"], &[data-menu="externalchapters"], &[data-menu="iframe"], &[data-menu="text"], &[data-menu="zoomhd"] {
-               .caption {
-                       height: 0;
-                       padding: 0;
-                       position: relative;
-                       z-index: 4;
-
-                       a, div {
-                               &.button.back {
-                                       width: 30px;
-                                       height: 30px;
-                                       padding: 10px;
-                                       font-size: 7px;
-                                       line-height: 10px;
-                               }
-                       }
-               }
-
-               .ps__rail-x, .ps__rail-x {
-                       z-index: 4;
-               }
-       }
-
-       &[data-menu="text"] {
-               > .content > .text {
-                       li {
-                               list-style-position: outside;
-                               margin-left: 1em;
-                       }
-               }
-       }
-
-       // Popup with close button outside
-       &[data-menu="iframe"], &[data-menu="text"] {
-               overflow: visible;
-
-               a, div {
-                       &.button.back {
-                               right: -30px;
-                       }
-               }
-
-               &[data-type="10doigts"] {
-                       border-radius: 15px;
-
-                       a, div {
-                               &.button.back {
-                                       right: 0;
-                                       border-radius: 0 15px 0 0;
-                               }
-                       }
-               }
-
-               &.fs {
-                       a, div {
-                               &.button.back {
-                                       top: 0px;
-                                       right: 0px;
-                               }
-                       }
-               }
-       }
-
-       &[data-type="10doigts"] {
-               border-radius: 15px;
-       }
-
-       &[data-menu="iframe"] {
-               .iframeContainer, .iframeHolder {
-                       height: 100%;
-                       background-color: #fff;
-
-                       &[data-type="10doigts"] {
-                               border-radius: 15px;
-                       }
-               }
-
-               .content {
-                       &[data-type="10doigts"] {
-                               border-radius: 15px;
-                       }
-
-                       overflow: hidden;
-               }
-
-
-       }
-
-       &[data-menu="externalchapters"] {
-               .caption {
-                       a, div {
-                               &.button.back {
-                                       width: 60px;
-                                       height: 60px;
-                                       padding: 22px;
-                                       line-height: 1;
-                               }
-                       }
-               }
-       }
-
-       &[data-menu="bookmarks-help"] {
-               .content {
-                       padding: 40px 70px 100px 70px;
-
-                       p {
-                               margin-bottom: 60px;
-                               font-size: 0.9em;
-                               text-align: center;
-                       }
-
-                       @w: 147px;
-
-                       .doubleThumb {
-                               position: relative;
-                               width: @w*2;
-                               height: @w/@book-page-ratio;
-                               margin: 0 auto;
-
-                               .thumb {
-
-                                       &:before {
-                                               display: none;
-                                       }
-
-                                       &.left {
-                                               margin-right: @w;
-
-                                       }
-
-                                       &.right {
-                                               left: @w;
-
-                                               .img {
-                                                       &:after {
-                                                               left: auto;
-                                                               right: -24px;
-                                                       }
-                                               }
-                                       }
-
-                                       a.bookmark {
-                                               pointer-events: none;
-                                       }
-
-                                       .img {
-                                               position: relative;
-                                               width: @w;
-                                               height: @w/@book-page-ratio;
-
-                                               &:after {
-                                                       content: "";
-                                                       position: absolute;
-                                                       z-index: -1;
-                                                       top: -24px;
-                                                       left: -24px;
-                                                       width: 100px;
-                                                       height: 100px;
-                                                       background-color: @menu-background;
-                                                       border: 2px solid #fff;
-                                                       border-radius: 50%;
-                                               }
-
-                                       }
-
-                                       .bookmark {
-                                               width: 60px;
-                                               height: 60px;
-                                               z-index: 2;
-                                       }
-                               }
-                       }
-               }
-       }
-
-       .zoomhdHolder {
-               position: relative;
-               width: 100%;
-               height: 100%;
-               overflow: hidden;
-
-               .zoomhdControls {
-                       position: absolute;
-                       bottom: 50px;
-                       left: 50%;
-                       width: 0;
-
-                       a {
-                               position: absolute;
-                               display: block;
-                               top: -20px;
-                               left: 10px;
-                               width: 50px;
-                               height: 50px;
-                               border-radius: 50%;
-                               background-color: @menu-button-background;
-                               color: @menu-text;
-
-                               &.minus {
-                                       left: -60px;
-                               }
-                       }
-               }
-
-               .zoomhdMove {
-                       position: absolute;
-                       width: 100%;
-                       height: 100%;
-                       top: 0;
-                       left: 0;
-
-                       .zoomhdRefScale {
-                               pointer-events: none;
-                               position: absolute;
-                               margin-top: -30px;
-                               top: 50%;
-                               left: 50%;
-
-                               .zoomhdScale {
-                                       position: absolute;
-                                       top: 50%;
-                                       left: 50%;
-
-                                       .zoomhdImage {
-                                               opacity: 0;
-                                               transition: opacity 500ms;
-                                               position: absolute;
-                                       }
-
-                                       img {
-                                               display: block;
-                                       }
-                               }
-                       }
-               }
-
-       }
-
-       &[data-menu="webvideo"], &[data-menu="webvideo"] {
-               iframe {
-                       width: 100%;
-                       height: 100%;
-               }
-       }
-
-       .fonctions {
-               padding: 0 @menu-padding @menu-padding 0;
-               text-align: right;
-
-               a {
-                       line-height: 12px;
-                       border-radius: 2px;
-                       text-transform: uppercase;
-                       margin: 0 0 0 10px;
-                       padding: 16px 25px;
-                       display: inline-block;
-                       height: 45px;
-                       text-align: center;
-               }
-       }
-
-       &.fs {
-               .fonctions {
-                       padding: 0 @menu-padding @menu-padding @menu-padding;
-
-                       a {
-                               display: block;
-                               margin: 0 0 10px 0;
-
-                               &:last-child {
-                                       margin: 0;
-                               }
-                       }
-               }
-       }
-
-       &[data-chapters] {
-               max-width: 320px;
-       }
-
-       &.animate {
-               transition: transform 600ms ease-out;
-       }
-
-       .caption {
-               padding: 20px @menu-padding;
-               width: 100%;
-               height: 60px;
-
-               h2 {
-                       font-size: 16px;
-                       line-height: 16px;
-                       font-weight: 400;
-                       margin: 0 auto;
-                       white-space: nowrap;
-               }
-
-               div.button, a {
-                       height: 27px;
-                       font-weight: 600;
-                       font-size: 14px;
-                       line-height: 25px;
-                       display: block;
-                       cursor: pointer;
-
-                       &.back {
-                               position: absolute;
-                               top: 0;
-                               right: 0;
-                               width: 60px;
-                               height: 60px;
-                               padding: 22px;
-                               line-height: 1;
-                               z-index: 1;
-
-                               &.small {
-                                       width: 30px;
-                                       height: 30px;
-                                       padding: 10px;
-                                       font-size: 7px;
-                                       line-height: 10px;
-                               }
-
-                               .rtl & {
-                                       right: auto;
-                                       left: 0;
-                               }
-                       }
-               }
-       }
-
-       .content {
-               text-align: center;
-               width: 100%;
-               overflow: hidden;
-               position: relative;
-               -webkit-overflow-scrolling: touch;
-       }
+  .menu-color(@menu-background, @menu-button-background);
+  color: @menu-text;
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 22;
+  display: none;
+  overflow: hidden;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  max-width: 600px;
+  width: 100%;
+
+  @menutransition: 400ms;
+
+  transition: opacity @menutransition, top @menutransition;
+
+  &[data-menu="multimedia"], &[data-menu="webvideo"], &[data-menu="video"], &[data-menu="externalchapters"], &[data-menu="iframe"], &[data-menu="text"], &[data-menu="zoomhd"] {
+    .caption {
+      height: 0;
+      padding: 0;
+      position: relative;
+      z-index: 4;
+
+      a, div {
+        &.button.back {
+          width: 30px;
+          height: 30px;
+          padding: 10px;
+          font-size: 7px;
+          line-height: 10px;
+        }
+      }
+    }
+
+    .ps__rail-x, .ps__rail-x {
+      z-index: 4;
+    }
+  }
+
+  &[data-menu="text"] {
+    > .content > .text {
+      li {
+        list-style-position: outside;
+        margin-left: 1em;
+      }
+    }
+  }
+
+  // Popup with close button outside
+  &[data-menu="iframe"], &[data-menu="text"] {
+    overflow: visible;
+
+    a, div {
+      &.button.back {
+        right: -30px;
+      }
+    }
+
+    &[data-type="10doigts"] {
+      border-radius: 15px;
+
+      a, div {
+        &.button.back {
+          right: 0;
+          border-radius: 0 15px 0 0;
+        }
+      }
+    }
+
+    &.fs {
+      a, div {
+        &.button.back {
+          top: 0px;
+          right: 0px;
+        }
+      }
+    }
+  }
+
+  &[data-type="10doigts"] {
+    border-radius: 15px;
+  }
+
+  &[data-menu="iframe"] {
+    .iframeContainer, .iframeHolder {
+      height: 100%;
+      background-color: #fff;
+
+      &[data-type="10doigts"] {
+        border-radius: 15px;
+      }
+    }
+
+    .content {
+      &[data-type="10doigts"] {
+        border-radius: 15px;
+      }
+
+      overflow: hidden;
+    }
+
+
+  }
+
+  &[data-menu="externalchapters"] {
+    .caption {
+      a, div {
+        &.button.back {
+          width: 60px;
+          height: 60px;
+          padding: 22px;
+          line-height: 1;
+        }
+      }
+    }
+  }
+
+  &[data-menu="bookmarks-help"] {
+    .content {
+      padding: 40px 70px 100px 70px;
+
+      p {
+        margin-bottom: 60px;
+        font-size: 0.9em;
+        text-align: center;
+      }
+
+      @w: 147px;
+
+      .doubleThumb {
+        position: relative;
+        width: @w*2;
+        height: @w/@book-page-ratio;
+        margin: 0 auto;
+
+        .thumb {
+
+          &:before {
+            display: none;
+          }
+
+          &.left {
+            margin-right: @w;
+
+          }
+
+          &.right {
+            left: @w;
+
+            .img {
+              &:after {
+                left: auto;
+                right: -24px;
+              }
+            }
+          }
+
+          a.bookmark {
+            pointer-events: none;
+          }
+
+          .img {
+            position: relative;
+            width: @w;
+            height: @w/@book-page-ratio;
+
+            &:after {
+              content: "";
+              position: absolute;
+              z-index: -1;
+              top: -24px;
+              left: -24px;
+              width: 100px;
+              height: 100px;
+              background-color: @menu-background;
+              border: 2px solid #fff;
+              border-radius: 50%;
+            }
+
+          }
+
+          .bookmark {
+            width: 60px;
+            height: 60px;
+            z-index: 2;
+          }
+        }
+      }
+    }
+  }
+
+  .zoomhdHolder {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+
+    .zoomhdControls {
+      position: absolute;
+      bottom: 50px;
+      left: 50%;
+      width: 0;
+
+      a {
+        position: absolute;
+        display: block;
+        top: -20px;
+        left: 10px;
+        width: 50px;
+        height: 50px;
+        border-radius: 50%;
+        background-color: @menu-button-background;
+        color: @menu-text;
+
+        &.minus {
+          left: -60px;
+        }
+      }
+    }
+
+    .zoomhdMove {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      top: 0;
+      left: 0;
+
+      .zoomhdRefScale {
+        pointer-events: none;
+        position: absolute;
+        margin-top: -30px;
+        top: 50%;
+        left: 50%;
+
+        .zoomhdScale {
+          position: absolute;
+          top: 50%;
+          left: 50%;
+
+          .zoomhdImage {
+            opacity: 0;
+            transition: opacity 500ms;
+            position: absolute;
+          }
+
+          img {
+            display: block;
+          }
+        }
+      }
+    }
+
+  }
+
+  &[data-menu="webvideo"], &[data-menu="webvideo"] {
+    iframe {
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  .fonctions {
+    padding: 0 @menu-padding @menu-padding 0;
+    text-align: right;
+
+    a {
+      line-height: 12px;
+      border-radius: 2px;
+      text-transform: uppercase;
+      margin: 0 0 0 10px;
+      padding: 16px 25px;
+      display: inline-block;
+      height: 45px;
+      text-align: center;
+    }
+  }
+
+  &.fs {
+    .fonctions {
+      padding: 0 @menu-padding @menu-padding @menu-padding;
+
+      a {
+        display: block;
+        margin: 0 0 10px 0;
+
+        &:last-child {
+          margin: 0;
+        }
+      }
+    }
+  }
+
+  &[data-chapters] {
+    max-width: 320px;
+  }
+
+  &.animate {
+    transition: transform 600ms ease-out;
+  }
+
+  .caption {
+    padding: 20px @menu-padding;
+    width: 100%;
+    height: 60px;
+
+    h2 {
+      font-size: 16px;
+      line-height: 16px;
+      font-weight: 400;
+      margin: 0 auto;
+      white-space: nowrap;
+    }
+
+    div.button, a {
+      height: 27px;
+      font-weight: 600;
+      font-size: 14px;
+      line-height: 25px;
+      display: block;
+      cursor: pointer;
+
+      &.back {
+        position: absolute;
+        top: 0;
+        right: 0;
+        width: 60px;
+        height: 60px;
+        padding: 22px;
+        line-height: 1;
+        z-index: 1;
+
+        &.small {
+          width: 30px;
+          height: 30px;
+          padding: 10px;
+          font-size: 7px;
+          line-height: 10px;
+        }
+
+        .rtl & {
+          right: auto;
+          left: 0;
+        }
+      }
+    }
+  }
+
+  .content {
+    text-align: center;
+    width: 100%;
+    overflow: hidden;
+    position: relative;
+    -webkit-overflow-scrolling: touch;
+  }
 }
 
 form input[type="text"], form input[type="email"] {
-       background-color: @menu-field-background;
-       color: @menu-field-text;
+  background-color: @menu-field-background;
+  color: @menu-field-text;
 }
 
 #indexView {
-       #indexViewHolder {
-               margin: auto;
-               text-align: left;
-       }
-
-       .doubleThumb, .padding {
-               display: inline-block;
-               padding: 10px 10px 25px 10px;
-               margin: 0 5px 15px;
-               position: relative;
-               width: 200px;
-               cursor: pointer;
-               text-align: center;
-               box-sizing: content-box;
-               border-radius: 3px;
-
-               &.singlemode {
-                       width: 100px;
-               }
-       }
-
-       &.bookmarkView {
-               @padding: @menu-padding - 10px;
-               text-align: left;
-               width: 100%;
-               padding: 20px @padding 0;
-
-               .doubleThumb {
-                       width: 100px;
-               }
-       }
+  #indexViewHolder {
+    margin: auto;
+    text-align: left;
+  }
+
+  .doubleThumb, .padding {
+    display: inline-block;
+    padding: 10px 10px 25px 10px;
+    margin: 0 5px 15px;
+    position: relative;
+    width: 200px;
+    cursor: pointer;
+    text-align: center;
+    box-sizing: content-box;
+    border-radius: 3px;
+
+    &.singlemode {
+      width: 100px;
+    }
+  }
+
+  &.bookmarkView {
+    @padding: @menu-padding - 10px;
+    text-align: left;
+    width: 100%;
+    padding: 20px @padding 0;
+
+    .doubleThumb {
+      width: 100px;
+    }
+  }
 
 }
 
 #indexViewMessage {
-       padding: 2em 0;
-       text-align: center;
+  padding: 2em 0;
+  text-align: center;
 }
 
 .doubleThumb {
-       height: @thumb-height;
-
-       &.left {
-               margin-right: 10px;
-       }
-
-       &.simple {
-               .overlay {
-                       width: 100px;
-               }
-
-               &.left {
-                       .hits {
-                               left: -50px;
-                       }
-
-                       &.singlemode {
-                               .hits {
-                                       left: 0px;
-                               }
-                       }
-               }
-
-               &.right {
-                       .hits {
-                               left: 50px;
-                       }
-               }
-       }
-
-       &.here {
-               background-color: @menu-select-background;
-               color: @menu-select-text;
-       }
-
-       .overlay {
-               background-color: rgba(0, 0, 0, 0.5);
-               position: absolute;
-               top: 0px;
-               left: 0px;
-               width: 200px;
-               z-index: 4;
-       }
-
-       @hits-top: (@thumb-height - 26) / 2;
-
-       .hits {
-               position: relative;
-               display: inline;
-
-               z-index: 5;
-               font-size: 12px;
-               height: 26px;
-               top: @hits-top;
-
-               &.yes {
-                       padding: 5px;
-                       border-radius: 1px;
-                       color: @menu-text;
-                       background-color: @menu-background;
-               }
-       }
+  height: @thumb-height;
+
+  &.left {
+    margin-right: 10px;
+  }
+
+  &.simple {
+    .overlay {
+      width: 100px;
+    }
+
+    &.left {
+      .hits {
+        left: -50px;
+      }
+
+      &.singlemode {
+        .hits {
+          left: 0px;
+        }
+      }
+    }
+
+    &.right {
+      .hits {
+        left: 50px;
+      }
+    }
+  }
+
+  &.here {
+    background-color: @menu-select-background;
+    color: @menu-select-text;
+  }
+
+  .overlay {
+    background-color: rgba(0, 0, 0, 0.5);
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    width: 200px;
+    z-index: 4;
+  }
+
+  @hits-top: (@thumb-height - 26) / 2;
+
+  .hits {
+    position: relative;
+    display: inline;
+
+    z-index: 5;
+    font-size: 12px;
+    height: 26px;
+    top: @hits-top;
+
+    &.yes {
+      padding: 5px;
+      border-radius: 1px;
+      color: @menu-text;
+      background-color: @menu-background;
+    }
+  }
 }
 
 .padding {
-       height: 1px;
+  height: 1px;
 }
 
 .thumb {
-       position: absolute;
-
-       .bookmark {
-               width: 35px;
-               height: 35px;
-               z-index: 2;
-       }
-
-       .img {
-               width: 100px;
-               height: @thumb-height;
-               background-color: transparent;
-               position: relative;
-               z-index: 1;
-               background-blend-mode: normal, overlay;
-               // Fix #2631
-               .android.chrome &{
-                       background-blend-mode: normal, normal;
-               }
-               background-repeat: no-repeat;
-       }
-
-       .number {
-               text-align: center;
-               display: block;
-               margin: 0;
-               padding: 5px 0 0 0;
-               max-width: 100px;
-               position: relative;
-               z-index: 1;
-               font-size: 14px;
-               line-height: 1;
-       }
-
-       &.right {
-               left: 110px;
-       }
-
-       &.simple {
-               width: 100px;
-
-               &.right {
-                       margin-left: 100px;
-               }
-       }
-
-       &.left {
-               margin-right: 100px;
-       }
-
-       @extrashadowheight: min(22, @thumb-height*0.2);
-       @shade-height: unit(@thumb-height+@extrashadowheight, px);
-
-       &:before {
-               position: absolute;
-               content: "";
-               background-image: url("../images/shadows/thumbnails/back.png");
-               background-size: 100% 100%;
-               background-repeat: no-repeat;
-               opacity: 0.65;
-               top: -5px;
-               left: -5px;
-               width: 111px;
-               height: @shade-height;
-               z-index: 0;
-       }
+  position: absolute;
+
+  .bookmark {
+    width: 35px;
+    height: 35px;
+    z-index: 2;
+  }
+
+  .img {
+    width: 100px;
+    height: @thumb-height;
+    background-color: transparent;
+    position: relative;
+    z-index: 1;
+    background-blend-mode: normal, overlay;
+    // Fix #2631
+    .android.chrome & {
+      background-blend-mode: normal, normal;
+    }
+
+    background-repeat: no-repeat;
+  }
+
+  .number {
+    text-align: center;
+    display: block;
+    margin: 0;
+    padding: 5px 0 0 0;
+    max-width: 100px;
+    position: relative;
+    z-index: 1;
+    font-size: 14px;
+    line-height: 1;
+  }
+
+  &.right {
+    left: 110px;
+  }
+
+  &.simple {
+    width: 100px;
+
+    &.right {
+      margin-left: 100px;
+    }
+  }
+
+  &.left {
+    margin-right: 100px;
+  }
+
+  @extrashadowheight: min(22, @thumb-height*0.2);
+  @shade-height: unit(@thumb-height+@extrashadowheight, px);
+
+  &:before {
+    position: absolute;
+    content: "";
+    background-image: url("../images/shadows/thumbnails/back.png");
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+    opacity: 0.65;
+    top: -5px;
+    left: -5px;
+    width: 111px;
+    height: @shade-height;
+    z-index: 0;
+  }
 
 }
 
 /* Share */
 
 ul.chapters.shareList a.level0 .svg-icon {
-       height: 25px;
-       width: 25px;
-       display: inline-block;
-       vertical-align: middle;
-       margin: 0 10px 6px 0;
+  height: 25px;
+  width: 25px;
+  display: inline-block;
+  vertical-align: middle;
+  margin: 0 10px 6px 0;
 
-       .rtl & {
-               margin: 0 0 6px 10px;
-       }
+  .rtl & {
+    margin: 0 0 6px 10px;
+  }
 }
 
 @import "help";
 
 /* Archives */
 #archivesview {
-       position: relative;
-       overflow: hidden;
-       top: 44px;
+  position: relative;
+  overflow: hidden;
+  top: 44px;
 }
 
 #archivesview .links {
-       position: absolute;
-       top: 0px;
-       left: 0px;
+  position: absolute;
+  top: 0px;
+  left: 0px;
 }
 
 #archivesview .links .link {
-       position: absolute;
+  position: absolute;
 }
 
 /* Inner view */
 
 #innerView {
-       position: absolute;
-       top: 0px;
-       left: 0px;
-       z-index: 30;
-       display: none;
-
-       > div {
-               position: absolute;
-               border-radius: 10px;
-               padding: 20px;
-               font-size: 0.8rem;
-               background-color: @menu-background;
-               color: @menu-text;
-
-               p {
-                       margin: 0 0 20px 0;
-               }
-       }
-
-       form {
-               input {
-                       &[type="text"], &[type="email"] {
-                               font-family: @font;
-                               padding: 5px;
-                               border-radius: 1px;
-                               border: 0;
-                               width: 100%;
-                               margin: 7px 0;
-                       }
-               }
-       }
-
-       .close {
-               position: absolute;
-               top: 0px;
-               right: 0px;
-               width: 34px;
-               height: 34px;
-               display: block;
-               background-image: url("../data/images/interface-close.svg");
-               background-size: 14px 14px;
-               background-position: 50% 50%;
-               background-repeat: no-repeat;
-       }
-
-       input[type="submit"] {
-               background-image: -moz-linear-gradient(top, #ffffff 0%, #a2a2a2 100%); /* FF3.6+ */
-               background-image: -webkit-linear-gradient(top, #ffffff 0%, #a2a2a2 100%); /* Chrome10+,Safari5.1+ */
-               background-image: -o-linear-gradient(top, #ffffff 0%, #a2a2a2 100%); /* Opera 11.10+ */
-               background-image: -ms-linear-gradient(top, #ffffff 0%, #a2a2a2 100%); /* IE10+ */
-               background-image: linear-gradient(to bottom, #ffffff 0%, #a2a2a2 100%); /* W3C */
-               border: 0;
-               color: #000;
-               font-weight: bold;
-               position: absolute;
-               right: 20px;
-               bottom: 20px;
-               padding: 4px 10px 6px;
-               border-radius: 1px;
-               display: inline-block;
-               cursor: pointer;
-       }
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  z-index: 30;
+  display: none;
+
+  > div {
+    position: absolute;
+    border-radius: 10px;
+    padding: 20px;
+    font-size: 0.8rem;
+    background-color: @menu-background;
+    color: @menu-text;
+
+    p {
+      margin: 0 0 20px 0;
+    }
+  }
+
+  form {
+    input {
+      &[type="text"], &[type="email"] {
+        font-family: @font;
+        padding: 5px;
+        border-radius: 1px;
+        border: 0;
+        width: 100%;
+        margin: 7px 0;
+      }
+    }
+  }
+
+  .close {
+    position: absolute;
+    top: 0px;
+    right: 0px;
+    width: 34px;
+    height: 34px;
+    display: block;
+    background-image: url("../data/images/interface-close.svg");
+    background-size: 14px 14px;
+    background-position: 50% 50%;
+    background-repeat: no-repeat;
+  }
+
+  input[type="submit"] {
+    background-image: -moz-linear-gradient(top, #ffffff 0%, #a2a2a2 100%); /* FF3.6+ */
+    background-image: -webkit-linear-gradient(top, #ffffff 0%, #a2a2a2 100%); /* Chrome10+,Safari5.1+ */
+    background-image: -o-linear-gradient(top, #ffffff 0%, #a2a2a2 100%); /* Opera 11.10+ */
+    background-image: -ms-linear-gradient(top, #ffffff 0%, #a2a2a2 100%); /* IE10+ */
+    background-image: linear-gradient(to bottom, #ffffff 0%, #a2a2a2 100%); /* W3C */
+    border: 0;
+    color: #000;
+    font-weight: bold;
+    position: absolute;
+    right: 20px;
+    bottom: 20px;
+    padding: 4px 10px 6px;
+    border-radius: 1px;
+    display: inline-block;
+    cursor: pointer;
+  }
 }
 
 @import "fluidbook.video.less";
 /* multimedia */
 
 .mview {
-       .multimediaContainer {
-               padding: 0;
-               position: relative;
-
-               &:after {
-                       content: '';
-                       position: absolute;
-                       z-index: 2;
-                       width: 100%;
-                       height: 100%;
-                       top: 0;
-                       left: 0;
-                       pointer-events: auto;
-               }
-       }
-
-       img.multimedia {
-               position: relative;
-               z-index: 1;
-               width: 100%;
-               height: auto;
-               display: block;
-       }
-
-       .text {
-               padding: 20px;
-               white-space: pre-line;
-               text-align: left;
-       }
-
-       &[data-menu="multimedia"] {
-               background: transparent;
-
-               &.fs {
-                       background: @menu-background;
-               }
-       }
-
-       .links {
-               position: absolute;
-               top: 0;
-               left: 0;
-
-               .link {
-                       position: absolute;
-               }
-       }
+  .multimediaContainer {
+    padding: 0;
+    position: relative;
+
+    &:after {
+      content: '';
+      position: absolute;
+      z-index: 2;
+      width: 100%;
+      height: 100%;
+      top: 0;
+      left: 0;
+      pointer-events: auto;
+    }
+  }
+
+  img.multimedia {
+    position: relative;
+    z-index: 1;
+    width: 100%;
+    height: auto;
+    display: block;
+  }
+
+  .text {
+    padding: 20px;
+    white-space: pre-line;
+    text-align: left;
+  }
+
+  &[data-menu="multimedia"] {
+    background: transparent;
+
+    &.fs {
+      background: @menu-background;
+    }
+  }
+
+  .links {
+    position: absolute;
+    top: 0;
+    left: 0;
+
+    .link {
+      position: absolute;
+    }
+  }
 }
 
 // Chapters
 
 ul.chapters {
-       list-style: none;
-       padding: 20px 0;
+  list-style: none;
+  padding: 20px 0;
 
-       ul {
-               list-style: none;
-       }
-
-       > li {
-               clear: both;
-       }
+  ul {
+    list-style: none;
+  }
+
+  > li {
+    clear: both;
+  }
 
-       li {
-               position: relative;
-
-               &[data-level="1"] + [data-level="0"] {
-                       margin-top: 15px;
-               }
-
-               &[data-level="2"] + [data-level="1"] {
-                       margin-top: 10px;
-               }
-
-               &[data-level="3"] + [data-level="2"] {
-                       margin-top: 5px;
-               }
-
-               &.separator {
-                       height: 20px;
-               }
-       }
-
-       a {
-               font-size: 16px;
-               display: block;
-               text-align: left;
-               padding: 5px 32px;
-               transition: background-color 250ms;
-
-               .rtl & {
-                       text-align: right;
-               }
-
-               &.level-1 {
-                       font-family: @font;
-                       font-weight: 400;
-                       text-align: center;
-
-                       .right {
-                               display: none;
-                       }
-               }
-
-               &.level0 {
-                       font-family: @font;
-                       font-weight: 400;
-
-                       .right .puce {
-                               margin: 2px 0 0 0;
-                       }
-
-               }
-
-               &.level1 {
-                       padding-left: 50px;
-
-                       .rtl & {
-                               padding-left: 0;
-                               padding-right: 50px;
-                       }
-
-               }
-
-               &.level2 {
-                       padding-left: 80px;
-
-                       .rtl & {
-                               padding-left: 0;
-                               padding-right: 80px;
-                       }
-
-                       .right .puce {
-                               margin: -2px 0 0 0;
-                       }
-               }
-
-               .level3 {
-                       padding-left: 110px;
-
-                       .rtl & {
-                               padding-left: 0;
-                               padding-right: 110px;
-                       }
-               }
-
-               > nav {
-                       display: none;
-               }
-       }
-
-       li > a > span {
-               display: block;
-               padding-right: 30px;
-
-               .rtl & {
-                       padding-right: 0;
-                       padding-left: 30px;
-               }
-
-       }
-
-       .right {
-               right: 32px;
-               top: 5px;
-               position: absolute;
-               display: inline-block;
-               vertical-align: top;
-               width: 25px;
-               height: 25px;
-               text-align: center;
-
-               .rtl & {
-                       right: auto;
-                       left: 32px;
-               }
-
-               .puce {
-                       width: 25px;
-                       height: 25px;
-                       color: #fff;
-                       position: relative;
-                       display: flex;
-                       align-items: center;
-                       justify-content: center;
-
-                       .rtl & {
-                               transform: rotate(180deg);
-                       }
-
-                       svg {
-                               width: 16px;
-                               height: 16px;
-                       }
-
-                       border-radius: 1px;
-
-                       &.noshadow {
-                               border-radius: 0px;
-
-                               box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
-                               -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
-                               -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
-                               -ms-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
-                               -o-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
-
-                               margin: 0 0 0 15px;
-                               float: right;
-                       }
-               }
-       }
+  li {
+    position: relative;
+
+    &[data-level="1"] + [data-level="0"] {
+      margin-top: 15px;
+    }
+
+    &[data-level="2"] + [data-level="1"] {
+      margin-top: 10px;
+    }
+
+    &[data-level="3"] + [data-level="2"] {
+      margin-top: 5px;
+    }
+
+    &.separator {
+      height: 20px;
+    }
+  }
+
+  a {
+    font-size: 16px;
+    display: block;
+    text-align: left;
+    padding: 5px 32px;
+    transition: background-color 250ms;
+
+    .rtl & {
+      text-align: right;
+    }
+
+    &.level-1 {
+      font-family: @font;
+      font-weight: 400;
+      text-align: center;
+
+      .right {
+        display: none;
+      }
+    }
+
+    &.level0 {
+      font-family: @font;
+      font-weight: 400;
+
+      .right .puce {
+        margin: 2px 0 0 0;
+      }
+
+    }
+
+    &.level1 {
+      padding-left: 50px;
+
+      .rtl & {
+        padding-left: 0;
+        padding-right: 50px;
+      }
+
+    }
+
+    &.level2 {
+      padding-left: 80px;
+
+      .rtl & {
+        padding-left: 0;
+        padding-right: 80px;
+      }
+
+      .right .puce {
+        margin: -2px 0 0 0;
+      }
+    }
+
+    .level3 {
+      padding-left: 110px;
+
+      .rtl & {
+        padding-left: 0;
+        padding-right: 110px;
+      }
+    }
+
+    > nav {
+      display: none;
+    }
+  }
+
+  li > a > span {
+    display: block;
+    padding-right: 30px;
+
+    .rtl & {
+      padding-right: 0;
+      padding-left: 30px;
+    }
+
+  }
+
+  .right {
+    right: 32px;
+    top: 5px;
+    position: absolute;
+    display: inline-block;
+    vertical-align: top;
+    width: 25px;
+    height: 25px;
+    text-align: center;
+
+    .rtl & {
+      right: auto;
+      left: 32px;
+    }
+
+    .puce {
+      width: 25px;
+      height: 25px;
+      color: #fff;
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      .rtl & {
+        transform: rotate(180deg);
+      }
+
+      svg {
+        width: 16px;
+        height: 16px;
+      }
+
+      border-radius: 1px;
+
+      &.noshadow {
+        border-radius: 0px;
+
+        box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
+        -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
+        -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
+        -ms-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
+        -o-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0);
+
+        margin: 0 0 0 15px;
+        float: right;
+      }
+    }
+  }
 }
 
 /* ipad mag */
 .pad #pagesnumbers,
 .pad footer {
-       display: none;
+  display: none;
 }
 
 .pad #interface,
 .pad header {
-       opacity: 0;
-       visibility: hidden;
-       z-index: 21;
+  opacity: 0;
+  visibility: hidden;
+  z-index: 21;
 }
 
 .pad #interface {
-       position: absolute;
-       top: 0px;
-       left: 0px;
-       width: 100%;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  width: 100%;
 }
 
 #down {
-       display: none;
+  display: none;
 }
 
 .pad #down {
-       display: block;
-       width: 40px;
-       height: 40px;
-       border-radius: 1px;
-       background-image: url("../data/images/interface-down.svg");
-       background-repeat: no-repeat;
-       padding: 8px 8px 8px 8px;
-       position: absolute;
-       bottom: 10px;
-       right: 10px;
-       background-size: 24px 24px;
-       background-position: 50% 50%;
-       z-index: 22;
-       opacity: 0;
-       background-color: rgba(0, 0, 0, 0.6);
-
-       transition: all .15s ease-out;
-       transform-origin: 50% 20px;
-
-       -moz-transform: rotate(0deg);
-       -webkit-transform: rotate(0deg);
-       -ms-transform: rotate(0deg);
-       -o-transform: rotate(0deg);
-       transform: rotate(0deg);
+  display: block;
+  width: 40px;
+  height: 40px;
+  border-radius: 1px;
+  background-image: url("../data/images/interface-down.svg");
+  background-repeat: no-repeat;
+  padding: 8px 8px 8px 8px;
+  position: absolute;
+  bottom: 10px;
+  right: 10px;
+  background-size: 24px 24px;
+  background-position: 50% 50%;
+  z-index: 22;
+  opacity: 0;
+  background-color: rgba(0, 0, 0, 0.6);
+
+  transition: all .15s ease-out;
+  transform-origin: 50% 20px;
+
+  -moz-transform: rotate(0deg);
+  -webkit-transform: rotate(0deg);
+  -ms-transform: rotate(0deg);
+  -o-transform: rotate(0deg);
+  transform: rotate(0deg);
 }
 
 #down.right {
-       -moz-transform: rotate(-90deg);
-       -webkit-transform: rotate(-90deg);
-       -ms-transform: rotate(-90deg);
-       -o-transform: rotate(-90deg);
-       transform: rotate(-90deg);
+  -moz-transform: rotate(-90deg);
+  -webkit-transform: rotate(-90deg);
+  -ms-transform: rotate(-90deg);
+  -o-transform: rotate(-90deg);
+  transform: rotate(-90deg);
 }
 
 /*  Transitions */
 
 .doublePage {
-       &._2d, &._3d {
-               .page-transition(1);
-       }
+  &._2d, &._3d {
+    .page-transition(1);
+  }
 }
 
 /* 2D */
 .doublePage._2d.sliding {
-       transition: none;
+  transition: none;
 }
 
 /* 3D Flip */
 #flip3dcontainer {
-       height: 100%;
-       position: absolute;
-       top: 0;
-       left: 0;
-       z-index: 12;
-       pointer-events: none;
-       display: none;
-       overflow: hidden;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 12;
+  pointer-events: none;
+  display: none;
+  overflow: hidden;
 
-       canvas {
-               position: relative;
-               left: 0;
-       }
+  canvas {
+    position: relative;
+    left: 0;
+  }
 }
 
 .ios #pages {
-       transform: translateZ(1);
+  transform: translateZ(1);
 }
 
 /* 3D */
 #pages._3dtransition {
-       -moz-perspective-origin: 50% 75%;
-       -webkit-perspective-origin: 50% 75%;
-       -ms-perspective-origin: 50% 75%;
-       -o-perspective-origin: 50% 75%;
-       perspective-origin: 50% 75%;
+  -moz-perspective-origin: 50% 75%;
+  -webkit-perspective-origin: 50% 75%;
+  -ms-perspective-origin: 50% 75%;
+  -o-perspective-origin: 50% 75%;
+  perspective-origin: 50% 75%;
 
-       -moz-perspective: 5000px;
-       -webkit-perspective: 5000px;
-       -o-perspective: 5000px;
-       -ms-perspective: 5000px;
-       perspective: 5000px;
+  -moz-perspective: 5000px;
+  -webkit-perspective: 5000px;
+  -o-perspective: 5000px;
+  -ms-perspective: 5000px;
+  perspective: 5000px;
 
-       overflow: visible !important;
+  overflow: visible !important;
 }
 
 .doublePage._3d {
-       overflow: visible;
-       z-index: 100;
+  overflow: visible;
+  z-index: 100;
 
-       -moz-transform-style: preserve-3d;
-       -webkit-transform-style: preserve-3d;
-       -o-transform-style: preserve-3d;
-       -ms-transform-style: preserve-3d;
-       transform-style: preserve-3d;
+  -moz-transform-style: preserve-3d;
+  -webkit-transform-style: preserve-3d;
+  -o-transform-style: preserve-3d;
+  -ms-transform-style: preserve-3d;
+  transform-style: preserve-3d;
 }
 
 ._3d .page {
-       -moz-backface-visibility: hidden;
-       -webkit-backface-visibility: hidden;
-       -o-backface-visibility: hidden;
-       -ms-backface-visibility: hidden;
-       backface-visibility: hidden;
+  -moz-backface-visibility: hidden;
+  -webkit-backface-visibility: hidden;
+  -o-backface-visibility: hidden;
+  -ms-backface-visibility: hidden;
+  backface-visibility: hidden;
 
-       left: 0px !important;
+  left: 0px !important;
 }
 
 .doublePage._3d .right {
-       -webkit-transform: rotate3d(0, 1, 0, 0deg);
-       -o-transform: rotate3d(0, 1, 0, 0deg);
-       -ms-transform: rotate3d(0, 1, 0, 0deg);
-       transform: rotate3d(0, 1, 0, 0deg);
-       -moz-transform: rotateY(0deg) translate3d(0, 0, 0);
+  -webkit-transform: rotate3d(0, 1, 0, 0deg);
+  -o-transform: rotate3d(0, 1, 0, 0deg);
+  -ms-transform: rotate3d(0, 1, 0, 0deg);
+  transform: rotate3d(0, 1, 0, 0deg);
+  -moz-transform: rotateY(0deg) translate3d(0, 0, 0);
 }
 
 .mozrotation .doublePage._3d .right {
-       -moz-transform: rotateY(0deg) translate3d(0, 0, 0);
-       transform: rotateY(0deg) translate3d(0, 0, 0);
+  -moz-transform: rotateY(0deg) translate3d(0, 0, 0);
+  transform: rotateY(0deg) translate3d(0, 0, 0);
 }
 
 .doublePage._3d .left {
-       -webkit-transform: rotate3d(0, 1, 0, 180deg);
-       -o-transform: rotate3d(0, 1, 0, 180deg);
-       -ms-transform: rotate3d(0, 1, 0, 180deg);
-       transform: rotate3d(0, 1, 0, 180deg);
-       -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
+  -webkit-transform: rotate3d(0, 1, 0, 180deg);
+  -o-transform: rotate3d(0, 1, 0, 180deg);
+  -ms-transform: rotate3d(0, 1, 0, 180deg);
+  transform: rotate3d(0, 1, 0, 180deg);
+  -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
 }
 
 .mozrotation .doublePage._3d .left {
-       transform: rotateY(180deg) translate3d(0, 0, 0);
-       -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
+  transform: rotateY(180deg) translate3d(0, 0, 0);
+  -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
 }
 
 .doublePage._3d.nextstart {
-       -webkit-transform: rotate3d(0, 1, 0, 360deg);
-       -o-transform: rotate3d(0, 1, 0, 360deg);
-       -ms-transform: rotate3d(0, 1, 0, 360deg);
-       transform: rotate3d(0, 1, 0, 360deg);
-       -moz-transform: rotateY(360deg) translate3d(0, 0, 0);
+  -webkit-transform: rotate3d(0, 1, 0, 360deg);
+  -o-transform: rotate3d(0, 1, 0, 360deg);
+  -ms-transform: rotate3d(0, 1, 0, 360deg);
+  transform: rotate3d(0, 1, 0, 360deg);
+  -moz-transform: rotateY(360deg) translate3d(0, 0, 0);
 
-       -moz-transform-origin: 0 0;
-       -webkit-transform-origin: 0 0;
-       -o-transform-origin: 0 0;
-       -ms-transform-origin: 0 0;
-       transform-origin: 0 0;
+  -moz-transform-origin: 0 0;
+  -webkit-transform-origin: 0 0;
+  -o-transform-origin: 0 0;
+  -ms-transform-origin: 0 0;
+  transform-origin: 0 0;
 }
 
 .mozrotation .doublePage._3d.nextstart {
-       -moz-transform: rotateY(360deg) translate3d(0, 0, 0);
-       transform: rotateY(360deg) translate3d(0, 0, 0);
+  -moz-transform: rotateY(360deg) translate3d(0, 0, 0);
+  transform: rotateY(360deg) translate3d(0, 0, 0);
 }
 
 .doublePage._3d.nextend {
-       -webkit-transform: rotate3d(0, 1, 0, 180deg);
-       -o-transform: rotate3d(0, 1, 0, 180deg);
-       -ms-transform: rotate3d(0, 1, 0, 180deg);
-       transform: rotate3d(0, 1, 0, 180deg);
-       -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
+  -webkit-transform: rotate3d(0, 1, 0, 180deg);
+  -o-transform: rotate3d(0, 1, 0, 180deg);
+  -ms-transform: rotate3d(0, 1, 0, 180deg);
+  transform: rotate3d(0, 1, 0, 180deg);
+  -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
 }
 
 .mozrotation .doublePage._3d.nextend {
-       -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
-       transform: rotateY(180deg) translate3d(0, 0, 0);
+  -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
+  transform: rotateY(180deg) translate3d(0, 0, 0);
 }
 
 .doublePage._3d.prevstart {
-       -webkit-transform: rotate3d(0, 1, 0, 180deg);
-       -o-transform: rotate3d(0, 1, 0, 180deg);
-       -ms-transform: rotate3d(0, 1, 0, 180deg);
-       transform: rotate3d(0, 1, 0, 180deg);
-       -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
+  -webkit-transform: rotate3d(0, 1, 0, 180deg);
+  -o-transform: rotate3d(0, 1, 0, 180deg);
+  -ms-transform: rotate3d(0, 1, 0, 180deg);
+  transform: rotate3d(0, 1, 0, 180deg);
+  -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
 
-       -moz-transform-origin: 0 0;
-       -webkit-transform-origin: 0 0;
-       -o-transform-origin: 0 0;
-       -ms-transform-origin: 0 0;
-       transform-origin: 0 0;
+  -moz-transform-origin: 0 0;
+  -webkit-transform-origin: 0 0;
+  -o-transform-origin: 0 0;
+  -ms-transform-origin: 0 0;
+  transform-origin: 0 0;
 }
 
 .mozrotation .doublePage._3d.prevstart {
-       -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
-       transform: rotateY(180deg) translate3d(0, 0, 0);
+  -moz-transform: rotateY(180deg) translate3d(0, 0, 0);
+  transform: rotateY(180deg) translate3d(0, 0, 0);
 }
 
 .doublePage._3d.prevend {
 
-       -webkit-transform: rotate3d(0, 1, 0, 360deg);
-       -o-transform: rotate3d(0, 1, 0, 360deg);
-       -ms-transform: rotate3d(0, 1, 0, 360deg);
-       transform: rotate3d(0, 1, 0, 360deg);
-       -moz-transform: rotateY(360deg) translate3d(0, 0, 0);
+  -webkit-transform: rotate3d(0, 1, 0, 360deg);
+  -o-transform: rotate3d(0, 1, 0, 360deg);
+  -ms-transform: rotate3d(0, 1, 0, 360deg);
+  transform: rotate3d(0, 1, 0, 360deg);
+  -moz-transform: rotateY(360deg) translate3d(0, 0, 0);
 }
 
 .mozrotation .doublePage._3d.prevend {
-       -moz-transform: rotateY(360deg) translate3d(0, 0, 0);
-       transform: rotateY(360deg) translate3d(0, 0, 0);
+  -moz-transform: rotateY(360deg) translate3d(0, 0, 0);
+  transform: rotateY(360deg) translate3d(0, 0, 0);
 }
 
 #fontsLoader {
-       position: absolute;
-       bottom: 0px;
-       right: 0px;
-       width: 0;
-       height: 0px;
-       overflow: hidden;
+  position: absolute;
+  bottom: 0px;
+  right: 0px;
+  width: 0;
+  height: 0px;
+  overflow: hidden;
 }
 
 /*  Splash screen */
 #splash {
-       position: absolute;
-       top: 0;
-       left: 0;
-       z-index: 40;
-       width: 100%;
-       height: 100%;
-
-       .logo {
-               position: absolute;
-
-               // Make sure logo fits and is centred even on small screens
-               img {
-                       transition: opacity 400ms linear;
-                       max-width: 95%;
-                       height: auto;
-                       display: block;
-                       margin: 0 auto;
-                       opacity: 0;
-               }
-       }
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 40;
+  width: 100%;
+  height: 100%;
+
+  .logo {
+    position: absolute;
+
+    // Make sure logo fits and is centred even on small screens
+    img {
+      transition: opacity 400ms linear;
+      max-width: 95%;
+      height: auto;
+      display: block;
+      margin: 0 auto;
+      opacity: 0;
+    }
+  }
 }
 
 #popinOverlay {
-       position: absolute;
-       z-index: 29;
-       top: 0px;
-       left: 0px;
-       width: 100%;
-       height: 100%;
-       background-color: rgba(0, 0, 0, 0.3);
-       display: none;
+  position: absolute;
+  z-index: 29;
+  top: 0px;
+  left: 0px;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.3);
+  display: none;
 }
 
 #popinOverlay iframe {
-       background-color: #fff;
-       overflow: hidden;
+  background-color: #fff;
+  overflow: hidden;
 }
 
 #popinOverlay > * {
-       position: absolute;
-       z-index: 30;
-       top: 0px;
-       left: 0px;
+  position: absolute;
+  z-index: 30;
+  top: 0px;
+  left: 0px;
 
 }
 
 /* Tooltip */
 #tooltip {
-       @tooltip-arrows-size: 10px;
-
-       position: absolute;
-       background-color: @tooltip-background;
-       color: @tooltip-color;
-       top: 0px;
-       left: 0px;
-       padding: 20px 25px;
-       border-radius: 3px;
-       display: none;
-       font-size: 14px;
-       z-index: 100;
-       white-space: pre-wrap;
-       line-height: 16px;
-       -moz-transform-origin: 0 0;
-       -ms-transform-origin: 0 0;
-       -o-transform-origin: 0 0;
-       -webkit-transform-origin: 0 0;
-       transform-origin: 0 0;
-       box-sizing: border-box;
-       pointer-events: none;
-
-       &[data-style="invert"] {
-               font-weight: 700;
-               background-color: @tooltip-color;
-               color: @tooltip-background;
-
-               &[data-pos-y="n"] {
-                       &:after {
-                               border-bottom-color: @tooltip-color;
-                       }
-               }
-
-               &[data-pos-y="s"] {
-                       &:after {
-                               border-top-color: @tooltip-color;
-                       }
-               }
-       }
-
-       &[data-style="error"] {
-               font-weight: 700;
-               background-color: #cc0000;
-               color: #fff;
-
-               &[data-pos-y="n"] {
-                       &:after {
-                               border-bottom-color: #cc0000;
-                       }
-               }
-
-               &[data-pos-y="s"] {
-                       &:after {
-                               border-top-color: #cc0000;
-                       }
-               }
-       }
-
-       &:after {
-               content: "";
-               position: absolute;
-               width: 0;
-               height: 0;
-               border-left: @tooltip-arrows-size solid transparent;
-               border-right: @tooltip-arrows-size solid transparent;
-               display: block;
-       }
-
-       &[data-pos-y="n"] {
-               &:after {
-                       border-bottom: @tooltip-arrows-size solid @tooltip-background;
-                       top: unit(@tooltip-arrows-size*-1, px);
-               }
-       }
-
-       &[data-pos-y="s"] {
-               &:after {
-                       border-top: @tooltip-arrows-size solid @tooltip-background;
-                       bottom: unit(@tooltip-arrows-size*-1, px);
-               }
-       }
-
-       &[data-pos-x="w"] {
-               &:after {
-                       left: 16px;
-               }
-       }
-
-       &[data-pos-x="e"] {
-               &:after {
-                       right: 16px;
-               }
-       }
+  @tooltip-arrows-size: 10px;
+
+  position: absolute;
+  background-color: @tooltip-background;
+  color: @tooltip-color;
+  top: 0px;
+  left: 0px;
+  padding: 20px 25px;
+  border-radius: 3px;
+  display: none;
+  font-size: 14px;
+  z-index: 100;
+  white-space: pre-wrap;
+  line-height: 16px;
+  -moz-transform-origin: 0 0;
+  -ms-transform-origin: 0 0;
+  -o-transform-origin: 0 0;
+  -webkit-transform-origin: 0 0;
+  transform-origin: 0 0;
+  box-sizing: border-box;
+  pointer-events: none;
+
+  &[data-style="invert"] {
+    font-weight: 700;
+    background-color: @tooltip-color;
+    color: @tooltip-background;
+
+    &[data-pos-y="n"] {
+      &:after {
+        border-bottom-color: @tooltip-color;
+      }
+    }
+
+    &[data-pos-y="s"] {
+      &:after {
+        border-top-color: @tooltip-color;
+      }
+    }
+  }
+
+  &[data-style="error"] {
+    font-weight: 700;
+    background-color: #cc0000;
+    color: #fff;
+
+    &[data-pos-y="n"] {
+      &:after {
+        border-bottom-color: #cc0000;
+      }
+    }
+
+    &[data-pos-y="s"] {
+      &:after {
+        border-top-color: #cc0000;
+      }
+    }
+  }
+
+  &:after {
+    content: "";
+    position: absolute;
+    width: 0;
+    height: 0;
+    border-left: @tooltip-arrows-size solid transparent;
+    border-right: @tooltip-arrows-size solid transparent;
+    display: block;
+  }
+
+  &[data-pos-y="n"] {
+    &:after {
+      border-bottom: @tooltip-arrows-size solid @tooltip-background;
+      top: unit(@tooltip-arrows-size*-1, px);
+    }
+  }
+
+  &[data-pos-y="s"] {
+    &:after {
+      border-top: @tooltip-arrows-size solid @tooltip-background;
+      bottom: unit(@tooltip-arrows-size*-1, px);
+    }
+  }
+
+  &[data-pos-x="w"] {
+    &:after {
+      left: 16px;
+    }
+  }
+
+  &[data-pos-x="e"] {
+    &:after {
+      right: 16px;
+    }
+  }
 }
 
 /* Privacy settings */
 
 #cookieConsent {
-       background-color: rgba(0, 0, 0, 0.8);
-       position: fixed;
-       bottom: 0;
-       left: 0;
-       width: 100%;
-       padding: 20px 40px;
-       z-index: 20;
-
-       a.close {
-               position: absolute;
-               top: 0px;
-               right: 0px;
-               padding: 20px;
-               background-image: url("../images/close.svg");
-               background-size: 16px 16px;
-               background-repeat: no-repeat;
-               background-position: 20px 20px;
-               width: 56px;
-               height: 56px;
-       }
-
-       p {
-               text-align: center;
-               color: #ffffff;
-               font-size: 15px;
-               margin: 0 auto;
-               max-width: 1100px;
-
-               a {
-                       white-space: nowrap;
-                       text-decoration: underline;
-               }
-       }
+  background-color: rgba(0, 0, 0, 0.8);
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  padding: 20px 40px;
+  z-index: 20;
+
+  a.close {
+    position: absolute;
+    top: 0px;
+    right: 0px;
+    padding: 20px;
+    background-image: url("../images/close.svg");
+    background-size: 16px 16px;
+    background-repeat: no-repeat;
+    background-position: 20px 20px;
+    width: 56px;
+    height: 56px;
+  }
+
+  p {
+    text-align: center;
+    color: #ffffff;
+    font-size: 15px;
+    margin: 0 auto;
+    max-width: 1100px;
+
+    a {
+      white-space: nowrap;
+      text-decoration: underline;
+    }
+  }
 
 }
 
 /* Zoom Image Popups */
 #zoomPopupOverlay {
-       position: absolute;
-       top: 0;
-       left: 0;
-       width: 100%;
-       height: 100%;
-       z-index: 100;
-       display: none;
-       .overlayBackground();
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+  display: none;
+  .overlayBackground();
 }
 
 // Depending on the layout, hide one of the close buttons
 // We need to define both first and last rules in case there is only one zoom zone
 // In this case, the last written rule will apply
 #zoomPopupGroupWrapper {
-       &.layout-stacked {
-               .zoomPopupWrapper:last-of-type .zoomPopupClose {
-                       display: none;
-               }
+  &.layout-stacked {
+    .zoomPopupWrapper:last-of-type .zoomPopupClose {
+      display: none;
+    }
 
-               .zoomPopupWrapper:first-of-type .zoomPopupClose {
-                       display: block;
-               }
-       }
+    .zoomPopupWrapper:first-of-type .zoomPopupClose {
+      display: block;
+    }
+  }
 
-       &.layout-side-by-side {
-               .zoomPopupWrapper:first-of-type .zoomPopupClose {
-                       display: none;
-               }
+  &.layout-side-by-side {
+    .zoomPopupWrapper:first-of-type .zoomPopupClose {
+      display: none;
+    }
 
-               .zoomPopupWrapper:last-of-type .zoomPopupClose {
-                       display: block;
-               }
-       }
+    .zoomPopupWrapper:last-of-type .zoomPopupClose {
+      display: block;
+    }
+  }
 }
 
 .zoomPopupWrapper, .zoomPopupClose {
-       cursor: zoom-out !important; // Needed for close link, otherwise pointer cursor is used
+  cursor: zoom-out !important; // Needed for close link, otherwise pointer cursor is used
 }
 
 .zoomPopupWrapper {
-       display: none;
-       background-color: transparent;
-       background-repeat: no-repeat;
-       background-position: center;
-       background-size: cover;
-       transition: all 0.5s ease-in-out;
-       transform-origin: 0 0;
-       position: absolute;
-       z-index: 101;
-
-       &:hover {
-               .zoomPopupClose {
-                       opacity: 1;
-               }
-       }
-
-       img {
-               position: absolute;
-               top: 0;
-               left: 0;
-               width: 100%;
-               height: 100%;
-               display: block;
-               z-index: 102;
-       }
-
-       .zoomPopupClose {
-               @zoom-close-button-size: 30px;
-
-               position: absolute;
-               top: 0;
-               right: -@zoom-close-button-size;
-               width: @zoom-close-button-size;
-               height: @zoom-close-button-size;
-               padding: 11px;
-               z-index: 103;
-               background-color: @menu-button-background;
-               color: @menu-text;
-               opacity: 1;
-               transition: opacity 250ms;
-
-               .svg-icon {
-                       display: block; // Needed for proper positioning in centre of square
-               }
-
-               .rtl & {
-                       right: auto;
-                       left: 0;
-               }
-       }
+  display: none;
+  background-color: transparent;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: cover;
+  transition: all 0.5s ease-in-out;
+  transform-origin: 0 0;
+  position: absolute;
+  z-index: 101;
+
+  &:hover {
+    .zoomPopupClose {
+      opacity: 1;
+    }
+  }
+
+  img {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    display: block;
+    z-index: 102;
+  }
+
+  .zoomPopupClose {
+    @zoom-close-button-size: 30px;
+
+    position: absolute;
+    top: 0;
+    right: -@zoom-close-button-size;
+    width: @zoom-close-button-size;
+    height: @zoom-close-button-size;
+    padding: 11px;
+    z-index: 103;
+    background-color: @menu-button-background;
+    color: @menu-text;
+    opacity: 1;
+    transition: opacity 250ms;
+
+    .svg-icon {
+      display: block; // Needed for proper positioning in centre of square
+    }
+
+    .rtl & {
+      right: auto;
+      left: 0;
+    }
+  }
 }
 
 @import "lib/perfect-scrollbar.less";
 
 @media handled and (orientation: portrait) {
-       #ol {
-               display: none;
-       }
+  #ol {
+    display: none;
+  }
 
-       @-ms-viewport {
-               width: 800px;
-       }
+  @-ms-viewport {
+    width: 800px;
+  }
 }
 
 @media handled and (orientation: landscape) {
-       #op {
-               display: none;
-       }
+  #op {
+    display: none;
+  }
 
-       @-ms-viewport {
-               width: 1280px;
-       }
+  @-ms-viewport {
+    width: 1280px;
+  }
 }
 
 /* Blur input */
 body > input {
-       position: absolute;
-       bottom: 0;
-       left: 0;
+  position: absolute;
+  bottom: 0;
+  left: 0;
 }
 
 /* SVG Sprite */
 [class^="interface-"], [class*=" interface-"], [class^="nav-"], [class*=" nav-"], [class^="share-"], [class*=" share-"] {
-       display: inline-block;
-       fill: currentColor;
+  display: inline-block;
+  fill: currentColor;
 }
 
 /* Icon states */
 .icon-fullscreen {
 
-       // Full screen exit icon hidden by default
-       .nav-fullscreen-exit {
-               display: none;
-       }
+  // Full screen exit icon hidden by default
+  .nav-fullscreen-exit {
+    display: none;
+  }
 
-       // Switch icons
-       &.active {
-               .nav-fullscreen-exit {
-                       display: inline-block;
-               }
+  // Switch icons
+  &.active {
+    .nav-fullscreen-exit {
+      display: inline-block;
+    }
 
-               .nav-fullscreen {
-                       display: none;
-               }
-       }
+    .nav-fullscreen {
+      display: none;
+    }
+  }
 }
 
 .links .link.multimedia {
-       .tabs {
-               transition: opacity 400ms;
-               position: relative;
-
-               &.hide {
-                       opacity: 0;
-                       pointer-events: none;
-               }
-
-               .tablink {
-                       position: absolute;
-                       width: 100%;
-                       height: 100%;
-                       top: 0;
-                       left: 0;
-                       display: block;
-                       background: none !important;
-               }
-       }
+  .tabs {
+    transition: opacity 400ms;
+    position: relative;
+
+    &.hide {
+      opacity: 0;
+      pointer-events: none;
+    }
+
+    .tablink {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      top: 0;
+      left: 0;
+      display: block;
+      background: none !important;
+    }
+  }
 }
 
 .inlineslideshow {
-       width: 100%;
-       height: 100%;
-       max-width: 100%;
-       max-height: 100%;
-       overflow: hidden;
-
-       .slide {
-               display: none;
-               width: 100%;
-               height: 100%;
-               background-size: cover;
-               background-position: 50% 50%;
-               opacity: 0;
-
-               position: absolute;
-               top: 0;
-               left: 0;
-               z-index: 0;
-
-               &.show {
-                       z-index: 1;
-                       opacity: 1;
-                       transition: opacity @inlineslideshow-transition-time;
-               }
-       }
+  width: 100%;
+  height: 100%;
+  max-width: 100%;
+  max-height: 100%;
+  overflow: hidden;
+
+  .slide {
+    display: none;
+    width: 100%;
+    height: 100%;
+    background-size: cover;
+    background-position: 50% 50%;
+    opacity: 0;
+
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 0;
+
+    &.show {
+      z-index: 1;
+      opacity: 1;
+      transition: opacity @inlineslideshow-transition-time;
+    }
+  }
 }
 
 #links .fb_iframe_widget {
-       transform-origin: 0 0 0;
-       transform: scale(2.5);
+  transform-origin: 0 0 0;
+  transform: scale(2.5);
 }
 
 /* Landing Page */
 #landingPage {
-       opacity: 0;
-       pointer-events: none;
-       transition: opacity 0.3s ease-in;
-       z-index: 30;
-       position: absolute;
-       top: 0;
-       left: 0;
-       width: 100%;
-       height: 100%;
-
-       .edge & {
-               visibility: hidden;
-       }
-
-       &.visible {
-               opacity: 1;
-               pointer-events: auto;
-
-               .edge & {
-                       visibility: visible;
-               }
-       }
-
-       iframe {
-               width: 100%;
-               height: 100%;
-               border: none;
-       }
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.3s ease-in;
+  z-index: 30;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+
+  .edge & {
+    visibility: hidden;
+  }
+
+  &.visible {
+    opacity: 1;
+    pointer-events: auto;
+
+    .edge & {
+      visibility: visible;
+    }
+  }
+
+  iframe {
+    width: 100%;
+    height: 100%;
+    border: none;
+  }
 }
 
 .cart-bourbon-suggest {
 
-       padding: 30px;
-       width: 100%;
+  padding: 30px;
+  width: 100%;
 
-       label {
-               margin-bottom: 15px;
-               display: block;
-               text-align: left;
-       }
+  label {
+    margin-bottom: 15px;
+    display: block;
+    text-align: left;
+  }
 
-       input, textarea, select {
-               border: 2px solid #fff;
-               width: 100%;
-               padding: 8px;
-               display: block;
-               margin-top: 5px;
-               font-family: @font;
-               font-size: 14px;
+  input, textarea, select {
+    border: 2px solid #fff;
+    width: 100%;
+    padding: 8px;
+    display: block;
+    margin-top: 5px;
+    font-family: @font;
+    font-size: 14px;
 
-               &.parsley-error {
-                       border-color: #cc0000;
-               }
+    &.parsley-error {
+      border-color: #cc0000;
+    }
 
-       }
+  }
 
-       .parsley-errors-list {
-               display: none;
-       }
+  .parsley-errors-list {
+    display: none;
+  }
 
-       .fonctions {
-               padding: 20px 0 0 0;
-       }
+  .fonctions {
+    padding: 20px 0 0 0;
+  }
 
 }
 
 /* SEO */
 #seoContents {
-       display: none;
+  display: none;
 }
 
 /* General Utils */
 .pointer-events-none {
-       pointer-events: none;
+  pointer-events: none;
 }
 
 /* Webfonts*/
 
 @font-face {
-       font-family: 'Open Sans';
-       src: url("fonts/OpenSans-Regular.woff2") format("woff2"), url("fonts/OpenSans-Regular.woff") format("woff");
-       font-weight: 400;
-       font-style: normal;
+  font-family: 'Open Sans';
+  src: url("fonts/OpenSans-Regular.woff2") format("woff2"), url("fonts/OpenSans-Regular.woff") format("woff");
+  font-weight: 400;
+  font-style: normal;
 }
 
 @font-face {
-       font-family: 'Open Sans';
-       src: url("fonts/OpenSans-Semibold.woff2") format("woff2"), url("fonts/OpenSans-Semibold.woff") format("woff");
-       font-weight: 600;
-       font-style: normal;
+  font-family: 'Open Sans';
+  src: url("fonts/OpenSans-Semibold.woff2") format("woff2"), url("fonts/OpenSans-Semibold.woff") format("woff");
+  font-weight: 600;
+  font-style: normal;
 }
 
 /* Links anims rollovers */
 @keyframes enterupanddown {
-       0% {
-               margin-top: 0px;
-       }
-       100% {
-               margin-top: -40px;
-       }
+  0% {
+    margin-top: 0px;
+  }
+  100% {
+    margin-top: -40px;
+  }
 }
 
 [data-rollover="upanddown"] {
-       &.animaterollover {
-               animation: enterupanddown 0.25s cubic-bezier(0.250, 0.460, 0.450, 0.940) 2 alternate forwards;
-       }
+  &.animaterollover {
+    animation: enterupanddown 0.25s cubic-bezier(0.250, 0.460, 0.450, 0.940) 2 alternate forwards;
+  }
 }
 
 @import "print.less";
@@ -2910,9 +2916,9 @@ body > input {
 @import "additional.less";
 
 #pscanvas {
-       visibility: hidden;
+  visibility: hidden;
 }
 
 #loadedcontents {
-       display: none;
+  display: none;
 }