/*!
* www.KNACSS.com V3.0.3 (2014-05-19) @author: Raphael Goetter, Alsacreations
* Licence WTFPL http://www.wtfpl.net/
*/
/* ----------------------------- */
/* == soft reset                 */
/* ----------------------------- */
/* switching box model for all elements */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
    }
/* soft reset */
html, body {
    margin: 0;
    padding: 0
    }
ul, ol {
    padding-left: 2em
    }
ul.unstyled {
    list-style: none
    }
img {
    height: auto;
    vertical-align: middle;
    border: 0
    }
audio, canvas, video {
    display: inline-block
    }
svg:not(:root) {
    overflow: hidden
    }
/* ----------------------------- */
/* == typography                 */
/* ----------------------------- */
html {
    /* set base font-size to equiv "10px", which is adapted to rem unit */
    font-size: 62.5%;
    /* IE9-IE11 math fixing. See http://bit.ly/1g4X0bX */
    /* thanks to @guardian, @victorbritopro and @eQRoeil */
    font-size: calc(1em * 0.625);
    /* disallow text zooming on orientation change (non standard property) */
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
    }
body {
    /* set body font-size in em (1.4em equiv "14px") */
    font-size: 1.4em;
    background-color: #fff;
    color: #000;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 1.5
    }
/* font-sizing for content */
p, .p-like, ul, ol, dl, blockquote, pre, td, th, label, textarea, caption, details, figure {
    margin-top: 0.75em;
    margin-bottom: 0;
    line-height: 1.5
    }
h1, .h1-like {
    font-size: 3.2rem
    }
h2, .h2-like {
    font-size: 2.8rem
    }
h3, .h3-like {
    font-size: 2.4rem
    }
h4, .h4-like {
    font-size: 2rem
    }
h5, .h5-like {
    font-size: 1.8rem
    }
h6, .h6-like {
    font-size: 1.6rem
    }
/* alternate font-sizing */
.smaller {
    font-size: 0.71em
    }
.small {
    font-size: 0.86em
    }
.big {
    font-size: 1.14em
    }
.bigger {
    font-size: 1.29em
    }
.biggest {
    font-size: 1.43em
    }
code, pre, samp, kbd {
    /* IE fix */
    white-space: pre-line;
    white-space: pre-wrap;
    font-family: Consolas, "DejaVu Sans Mono", Courier, monospace;
    line-height: normal
    }
em, .em, address, cite, dfn, i, var {
    font-style: italic
    }
.no-em {
    font-style: normal
    }
strong, .strong {
    font-weight: bold
    }
.no-strong {
    font-weight: normal
    }
small, sub, sup {
    font-size: smaller
    }
/* ----------------------------- */
/* == hiding content             */
/* ----------------------------- */
/* hidden but not for assistance tools, Yahoo! method */
.visually-hidden {
    position: absolute !important;
    border: 0 !important;
    height: 1px !important;
    width: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(1px, 1px, 1px, 1px) !important
    }
body > script {
    display: none !important
    }
@media (max-width: 480px) {
    .no-small-screen {
        display: none
        }
    }
@media (min-width: 1024px) {
    .no-large-screen {
        display: none
        }
    }
/* ----------------------------- */
/* == browsers consistency       */
/* ----------------------------- */
/* avoid top margins on first content element */
p:first-child, .p-like:first-child, ul:first-child, ol:first-child, dl:first-child, blockquote:first-child, pre:first-child, h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {
    margin-top: 0
    }
/* avoid margins on nested elements */
li p, li .p-like, li ul, li ol {
    margin-top: 0;
    margin-bottom: 0
    }
/* max values */
img, table, td, blockquote, code, pre, textarea, input, video {
    max-width: 100%
    }
/* margin-bottom on tables */
table {
    margin-bottom: 2em
    }
/* ----------------------------- */
/* ==layout and modules          */
/* ----------------------------- */
/* float layout */
/* module, gains superpower "BFC" Block Formating Context */
.mod {
    overflow: hidden
    }
/* blocks that needs to be placed under floats */
.clear, .line, .row {
    clear: both
    }
/* blocks that must contain floats */
.clearfix:after, .line:after {
    content: "";
    display: table;
    clear: both
    }
/* table layout */
.row {
    display: table;
    table-layout: fixed;
    width: 100%
    }
.row > *, .col {
    display: table-cell;
    vertical-align: top
    }
/* inline-block */
.inbl {
    display: inline-block;
    vertical-align: top
    }
/* alignments (blocks and inline) */
/* ------------------------------ */
/* left (or starting) elements */
.left, .start {
    float: left
    }
img.left, img.start {
    margin-right: 1em
    }
/* right (or ending) elements */
.right, .end {
    float: right
    }
img.right, img.end {
    margin-left: 1em
    }
img.left, img.right, img.start, img.end {
    margin-bottom: 0.5em
    }
.center {
    margin-left: auto;
    margin-right: auto
    }
.txtleft {
    text-align: left
    }
.txtright {
    text-align: right
    }
.txtcenter {
    text-align: center
    }
.w20 {
    width: 10%
    }
.w20 {
    width: 20%
    }
.w25 {
    width: 25%
    }
.w30 {
    width: 30%
    }
.w33 {
    width: 33.3333%
    }
.w40 {
    width: 40%
    }
.w50 {
    width: 50%
    }
.w60 {
    width: 60%
    }
.w66 {
    width: 66.6666%
    }
.w70 {
    width: 70%
    }
.w75 {
    width: 75%
    }
.w80 {
    width: 80%
    }
.w90 {
    width: 90%
    }
.w100 {
    width: 100%
    }
.w50p {
    width: 50px
    }
.w100p {
    width: 100px
    }
.w150p {
    width: 150px
    }
.w200p {
    width: 200px
    }
.w300p {
    width: 300px
    }
.w400p {
    width: 400px
    }
.w500p {
    width: 500px
    }
.w600p {
    width: 600px
    }
.w700p {
    width: 700px
    }
.w800p {
    width: 800px
    }
.w960p {
    width: 960px
    }
.mw960p {
    max-width: 960px
    }
.w1140p {
    width: 1140px
    }
.mw1140p {
    max-width: 1140px
    }
.wauto {
    width: auto
    }
.man {
    margin: 0
    }
.pan {
    padding: 0
    }
.mas {
    margin: 1em
    }
.mam {
    margin: 2em
    }
.mal {
    margin: 4em
    }
.pas {
    padding: 1em
    }
.pam {
    padding: 2em
    }
.pal {
    padding: 4em
    }
.mtn {
    margin-top: 0
    }
.mts {
    margin-top: 1em
    }
.mtm {
    margin-top: 2em
    }
.mtl {
    margin-top: 4em
    }
.mrn {
    margin-right: 0
    }
.mrs {
    margin-right: 1em
    }
.mrm {
    margin-right: 2em
    }
.mrl {
    margin-right: 4em
    }
.mbn {
    margin-bottom: 0
    }
.mbs {
    margin-bottom: 1em
    }
.mbm {
    margin-bottom: 2em
    }
.mbl {
    margin-bottom: 4em
    }
.mln {
    margin-left: 0
    }
.mls {
    margin-left: 1em
    }
.mlm {
    margin-left: 2em
    }
.mll {
    margin-left: 4em
    }
.ptn {
    padding-top: 0
    }
.pts {
    padding-top: 1em
    }
.ptm {
    padding-top: 2em
    }
.ptl {
    padding-top: 4em
    }
.prn {
    padding-right: 0
    }
.prs {
    padding-right: 1em
    }
.prm {
    padding-right: 2em
    }
.prl {
    padding-right: 4em
    }
.pbn {
    padding-bottom: 0
    }
.pbs {
    padding-bottom: 1em
    }
.pbm {
    padding-bottom: 2em
    }
.pbl {
    padding-bottom: 4em
    }
.pln {
    padding-left: 0
    }
.pls {
    padding-left: 1em
    }
.plm {
    padding-left: 2em
    }
.pll {
    padding-left: 4em
    }
/* ---------------------------------- */
/* ==classic grids                    */
/* .. use it when gutter size matters */
/* ---------------------------------- */
/* grids inspired from SUIT https://github.com/suitcss/suit */
/* overall container of grids */
.grid {
    overflow: hidden
    }
/* global styles for direct child ex. .grid3 */
.grid > * {
    display: block;
    padding: 0;
    /* gutter value */
    margin-left: -20px;
    text-align: left
    }
/* global styles for each "cell" */
.grid > * > * {
    display: inline-block;
    /* gutter value */
    padding-left: 20px;
    margin-left: 0;
    vertical-align: top
    }
/* whitespace fixing for modern browsers including IE9+ */
:root .grid {
    font-size: 0;
    /* fallback for IE9+ */
    text-justify: distribute-all-lines
    }
:root .grid > * > * {
    /* fallback for Opera Mini */
    font-size: 14px;
    font-size: 1.4rem
    }
/* Opera hack */
.opera:-o-prefocus, .grid > * {
    word-spacing: -0.43em
    }
.grid2 > * {
    width: 50%
    }
.grid3 > * {
    width: 33.333%
    }
.grid4 > * {
    width: 25%
    }
.grid5 > * {
    width: 20%
    }
.grid6 > * {
    width: 16.667%
    }
.grid8 > * {
    width: 12.5%
    }
.grid10 > * {
    width: 10%
    }
.grid12 > * {
    width: 8.333%
    }
/* unequal grids (1-2, 2-1, 1-3 and 3-1) for 2 blocks */
.grid2-1 > *:first-child, .grid1-2 > * + * {
    width: 66.666%
    }
.grid1-2 > *:first-child, .grid2-1 > * + * {
    width: 33.333%
    }
.grid1-3 > *:first-child, .grid3-1 > * + * {
    width: 25%
    }
.grid3-1 > *:first-child, .grid1-3 > * + * {
    width: 75%
    }
/* Responsiv-o-matic */
@media (max-width: 1024px) {
    .grid5 > *, .grid6 > *, .grid8 > *, .grid10 > *, .grid12 > * {
        width: 33.333%
        }
    }
@media (max-width: 480px) {
    .grid3 > *, .grid4 > *, .grid5 > *, .grid6 > *, .grid8 > *, .grid10 > *, .grid12 > * {
        width: 50%
        }
    }
@media (max-width: 320px) {
    .grid > * > * {
        width: 100% !important
        }
    }
/* ---------------------------------- */
/* ==autogrids                        */
/* .. to automatically justify blocs  */
/* ---------------------------------- */
/* Demo : http://codepen.io/raphaelgoetter/pen/Kqehf */
/* container of autogrids */
[class*="autogrid"] {
    text-align: justify
    }
[class*="autogrid"]:after {
    content: "";
    display: inline-block;
    width: 100%
    }
[class*="autogrid"] > * {
    display: inline-block;
    vertical-align: top;
    text-align: left
    }
/* whitespace fixing for modern browsers including IE9+ */
:root[class*="autogrid"] {
    font-size: 0;
    /* fallback for IE9+ */
    text-justify: distribute-all-lines
    }
:root[class*="autogrid"] > * {
    /* fallback for Opera Mini */
    font-size: 14px;
    font-size: 1.4rem
    }
/* Opera hack */
[class*="autogrid"]:-o-prefocus {
    word-spacing: -0.43em
    }
.autogrid2 > * {
    width: 49%
    }
.autogrid3 > * {
    width: 32%
    }
.autogrid4 > * {
    width: 23.6%
    }
.autogrid5 > * {
    width: 19%
    }
.autogrid6 > * {
    width: 15%
    }
.autogrid8 > * {
    width: 10.8%
    }
.autogrid10 > * {
    width: 9%
    }
.autogrid12 > * {
    width: 6.4%
    }
@media (max-width: 1024px) {
    .autogrid5 > *, .autogrid6 > *, .autogrid8 > *, .autogrid10 > *, .autogrid12 > * {
        width: 32%
        }
    }
@media (max-width: 480px) {
    .autogrid5 > *, .autogrid6 > *, .autogrid8 > *, .autogrid10 > *, .autogrid12 > * {
        width: 49%
        }
    }
@media (max-width: 320px) {
    [class*="autogrid"] > * {
        width: 100%
        }
    }
/* ----------------------------- */
/* ==tables                      */
/* ----------------------------- */
table, .table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    vertical-align: top;
    border: 1px solid #ccc
    }
.table {
    display: table
    }
table#recaptcha_table, table.table-auto {
    table-layout: auto
    }
caption {
    padding: 1em;
    color: #555;
    font-style: italic
    }
td, th {
    padding: 0.3em 0.8em;
    border: 1px #aaa dotted;
    vertical-align: top;
    min-width: 2em;
    cursor: default;
    text-align: left
    }
/* ----------------------------- */
/* ==forms                       */
/* ----------------------------- */
/* thanks to HTML5boilerplate,
* github.com/nathansmith/formalize 
* and www.sitepen.com
*/
/* buttons */
.btn {
    display: inline-block
    }
/* forms items */
form, fieldset {
    border: none
    }
input, button, select, label, .btn {
    vertical-align: middle;
    font-family: inherit;
    font-size: inherit
    }
label {
    display: inline-block;
    vertical-align: middle;
    cursor: pointer
    }
legend {
    border: 0;
    white-space: normal
    }
textarea {
    min-height: 5em;
    vertical-align: top;
    font-family: inherit;
    font-size: inherit;
    resize: vertical
    }
/* clickable input types in iOS */
button, input[type="button"], input[type="reset"], input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button
    }
input[type="search"] {
    -webkit-appearance: textfield
    }
/* if select styling bugs on WebKit */
/* 'x' appears on right of search input when text is entered. This removes it */
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
    }
::-webkit-input-placeholder {
    color: #777
    }
input:-moz-placeholder, textarea:-moz-placeholder {
    color: #777
    }
/* Removes inner padding and border in FF3+ */
button::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner {
    border: 0;
    padding: 0
    }
/* ----------------------------- */
/* ==icons and bullets	         */
/* ----------------------------- */
.icon {
    display: inline-block
    }
.icon:before, .icon.after:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -0.1em;
    margin: 0 0.3em 0 0;
    font: 1.4em/1 sans-serif;
    color: #000;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.1);
    speak: none
    }
@media (min-device-width: 480px) {
    .icon:before, .icon.after:after {
        font: 1em/0.6 sans-serif;
        -webkit-transform: rotatez(0.05deg)
        }
    }
.icon.after:after {
    margin: 0 0 0 8px
    }
.icon.after:before {
    content: "" !important
    }
.icon-rate:before, .icon-rate.after:after {
    content: "★"
    }
.icon-unrate:before, .icon-unrate.after:after {
    content: "☆"
    }
.icon-check:before, .icon-check.after:after {
    content: "✓"
    }
.icon-uncheck:before, .icon-uncheck.after:after {
    content: "✗"
    }
.icon-cloud:before, .icon-cloud.after:after {
    content: "☁"
    }
.icon-dl:before, .icon-dl.after:after {
    content: "⇣";
    font-weight: bold
    }
.icon-cross:before, .icon-cross.after:after {
    content: "✖";
    font-weight: bold
    }
.icon-arrow1:before, .icon-arrow1.after:after {
    content: "→";
    position: relative;
    top: -0.15em
    }
.icon-arrow2:before, .icon-arrow2.after:after {
    content: "➞"
    }
.icon-arrow3:before, .icon-arrow3.after:after {
    content: "➚"
    }
.icon-bracket1:before, .icon-bracket1.after:after {
    content: "‹";
    font-weight: bold;
    font-size: 1.6em;
    position: relative;
    top: -0.15em
    }
.icon-bracket2:before, .icon-bracket2.after:after {
    content: "›";
    font-weight: bold;
    font-size: 1.6em;
    position: relative;
    top: -0.15em
    }
.icon-up:before, .icon-up.after:after {
    content: "▲"
    }
.icon-down:before, .icon-down.after:after {
    content: "▼"
    }
.icon-bull:before, .icon-bull.after:after {
    content: "•";
    font-size: 1.2em;
    top: -0.05em
    }
.icon-bull2:before, .icon-bull2.after:after {
    content: "◦";
    top: -0.05em
    }
.icon-bull3:before, .icon-bull3.after:after {
    content: "‣";
    font-size: 1.6em;
    top: -0.05em
    }
.icon-nav:before, .icon-nav.after:after {
    content: "≡";
    font-weight: bold
    }
.icon-losange:before, .icon-losange.after:after {
    content: "◆"
    }
.icon-asteri:before, .icon-asteri.after:after {
    content: "✱";
    font-weight: bold
    }
.icon-mail:before, .icon-mail.after:after {
    content: "✉";
    font-size: 1.6em;
    top: -0.05em
    }
/* ----------------------------- */
/* ==desktop and HD devices      */
/* ----------------------------- */
@media (min-width: 480px) {
    /* rules for big resources and big screens like: background-images, font-faces, etc. */
    }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
    /* style adjustments for high density devices */
    }
/* ---------------------------------- */
/* ==Responsive large / small / tiny  */
/* ---------------------------------- */
@media (min-width: 1024px) {
    /* layouts for large screens */
    .large-hidden {
        display: none !important
        }
    .large-visible {
        display: block !important
        }
    .large-no-float {
        float: none
        }
    .large-inbl {
        display: inline-block;
        float: none;
        vertical-align: top
        }
    .large-row {
        display: table;
        table-layout: fixed;
        width: 100% !important
        }
    .large-col {
        display: table-cell;
        vertical-align: top
        }
    /* widths for large screens */
    .large-w25 {
        width: 25% !important
        }
    .large-w33 {
        width: 33.3333% !important
        }
    .large-w50 {
        width: 50% !important
        }
    .large-w66 {
        width: 66.6666% !important
        }
    .large-w75 {
        width: 75% !important
        }
    .large-w100, .large-wauto {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0
        }
    /* margins for large screens */
    .large-man {
        margin: 0 !important
        }
    }
@media (max-width: 480px) {
    /* quick reset in small resolution and less */
    .w600p, .w700p, .w800p, .w960p, .mw960p {
        width: auto;
        float: none
        }
    /* layouts for small screens */
    .small-hidden {
        display: none !important
        }
    .small-visible {
        display: block !important
        }
    .small-no-float {
        float: none
        }
    .small-inbl {
        display: inline-block;
        float: none;
        vertical-align: top
        }
    .small-row {
        display: table !important;
        table-layout: fixed !important;
        width: 100% !important
        }
    .small-col {
        display: table-cell !important;
        vertical-align: top !important
        }
    /* widths for small screens */
    .small-w25 {
        width: 25% !important
        }
    .small-w33 {
        width: 33.3333% !important
        }
    .small-w50 {
        width: 50% !important
        }
    .small-w66 {
        width: 66.6666% !important
        }
    .small-w75 {
        width: 75% !important
        }
    .small-w100, .small-wauto {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0
        }
    /* margins for small screens */
    .small-man {
        margin: 0 !important
        }
    .small-pan {
        padding: 0 !important
        }
    }
@media (max-width: 320px) {
    /* quick tiny resolution reset */
    .mod, .col, fieldset {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0
        }
    .w300p, .w400p, .w500p {
        width: auto;
        float: none
        }
    .row {
        display: block !important;
        width: 100% !important
        }
    /* layouts for tiny screens */
    .tiny-hidden {
        display: none !important
        }
    .tiny-visible {
        display: block !important
        }
    .tiny-no-float {
        float: none
        }
    .tiny-inbl {
        display: inline-block;
        float: none;
        vertical-align: top
        }
    .tiny-row {
        display: table !important;
        table-layout: fixed !important;
        width: 100% !important
        }
    .tiny-col {
        display: table-cell !important;
        vertical-align: top !important
        }
    th, td {
        display: block !important;
        width: auto !important;
        text-align: left !important
        }
    thead {
        display: none
        }
    /* widths for tiny screens */
    .tiny-w25 {
        width: 25% !important
        }
    .tiny-w33 {
        width: 33.3333% !important
        }
    .tiny-w50 {
        width: 50% !important
        }
    .tiny-w66 {
        width: 66.6666% !important
        }
    .tiny-w75 {
        width: 75% !important
        }
    .tiny-w100, .tiny-wauto {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0
        }
    /* margins for tiny screens */
    .tiny-man {
        margin: 0 !important
        }
    .tiny-pan {
        padding: 0 !important
        }
    }
/* flexbox layout 
Tutorial: http://knacss.com/demos/tutoriel.html#flex */
.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
    }
.flex-h {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
    }
.flex-v {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
    }
.flex-fluid {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1
    }
.flex-start {
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -moz-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1
    }
.flex-mid {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
    }
.flex-end {
    -webkit-box-ordinal-group: 43;
    -webkit-order: 42;
    -moz-box-ordinal-group: 43;
    -ms-flex-order: 42;
    order: 42
    }
/* quick print reset */
@media print {
    * {
        background: transparent !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important
        }
    body {
        width: auto !important;
        margin: auto !important;
        font-family: serif;
        font-size: 12pt;
        background-color: #fff !important;
        color: #333 !important
        }
    p, h1, h2, h3, h4, h5, h6, blockquote, ul, ol {
        color: #000 !important;
        margin: auto !important
        }
    .print {
        display: block
        }
    .no-print {
        display: none
        }
    img {
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%)
        }
    /* no orphans, no widows */
    p, blockquote {
        orphans: 3;
        widows: 3
        }
    /* no breaks inside these elements */
    blockquote, ul, ol {
        page-break-inside: avoid
        }
    /* page break before main headers */
    h1 {
        page-break-before: always
        }
    /* no breaks after these elements */
    h1, h2, h3, caption {
        page-break-after: avoid
        }
    a {
        color: #000 !important;
        text-decoration: underline !important
        }
    /* displaying URLs */
    a[href]:after {
        content: " (" attr(href) ")"
        }
    a[href^="javascript:"]:after, a[href^="#"]:after {
        content: ""
        }
    }
/* ----------------------------- */
/* ==booleans                    */
/* ----------------------------- */
.skip-links {
    position: absolute
    }
.skip-links a {
    position: absolute;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    padding: 0.5em;
    background: black;
    color: white;
    text-decoration: none
    }
.skip-links a:focus {
    position: static;
    overflow: visible;
    clip: auto
    }
@media (max-width: 480px) {
    /* you shall not pass */
    div, textarea, table, td, th, code, pre, samp {
        word-wrap: break-word;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto
        }
    }
/* ----------------------------- */
/* ==gmaps support               */
/* ----------------------------- */
.gm-style img {
    height: 100%
    }
:not(.gm-style) img {
    height: auto
    }
.gm-style img, .gmnoscreen img, .gmnoprint img {
    max-width: none !important
    }
/* ----------------------------- */
/* ==IE6, IE7, IE8 support       */
/* ----------------------------- */
.ie67 * {
    behavior: url(/js/boxsizing.htc)
    }
.ie678 h1, .ie678 .h1-like {
    font-size: 2.29em
    }
.ie678 h2, .ie678 .h2-like {
    font-size: 2em
    }
.ie678 h3, .ie678 .h3-like {
    font-size: 1.71em
    }
.ie678 h4, .ie678 .h4-like {
    font-size: 1.43em
    }
.ie678 h5, .ie678 .h5-like {
    font-size: 1.29em
    }
.ie678 h6, .ie678 .h6-like {
    font-size: 1.14em
    }
.ie678 img {
    width: auto
    }
.ie678 .gm-style img {
    height: 100%
    }
.ie8 .grid > *, .ie8 [class*="autogrid"] > * {
    letter-spacing: -0.31em;
    text-rendering: optimizespeed
    }
.ie8 .grid > * > *, .ie8 [class*="autogrid"] > * > * {
    letter-spacing: normal;
    word-spacing: normal;
    text-rendering: auto
    }
.ie678 input[type="checkbox"], .ie678 input[type="radio"] {
    padding: 0
    }
.ie678 textarea {
    overflow: auto
    }
/* ----------------------------- */
/* ==minor stylings              */
/* ----------------------------- */
code, kbd, mark {
    border-radius: 2px
    }
kbd {
    padding: 0 2px;
    border: 1px solid #999
    }
code {
    padding: 2px 4px;
    background: rgba(0, 0, 0, 0.04);
    color: #b11
    }
pre code {
    padding: none;
    background: none;
    color: inherit;
    border-radius: 0
    }
mark {
    padding: 2px 4px;
    background: #ff0
    }
sup, sub {
    vertical-align: 0;
    position: relative
    }
sup {
    bottom: 1ex
    }
sub {
    top: 0.5ex
    }
blockquote {
    margin-left: 0;
    padding-left: 1em;
    border-left: 4px solid rgba(0, 0, 0, 0.15);
    font-style: italic
    }
q {
    font-style: normal
    }
q, .q {
    quotes: "“ " " â€"
    }
q:lang(fr), .q:lang(fr) {
    quotes: "« " " Â»"
    }
hr {
    display: block;
    clear: both;
    height: 1px;
    margin: 1em 0 2em;
    padding: 0;
    border: 0;
    color: #ccc;
    background-color: #ccc
    }
.alternate {
    border: 0
    }
.alternate tbody {
    border: 1px solid #ccc
    }
.alternate thead tr > * + * {
    border-left: 0
    }
.alternate tbody tr > * + * {
    border-left: 1px solid #ccc
    }
.alternate-vert {
    border: 0;
    border-right: 1px solid #ccc
    }
.alternate-vert tr > :first-child {
    border-bottom: 0
    }
.alternate-vert tr > * + * {
    border-top: 1px solid #ccc
    }
.striped tbody tr:nth-child(odd) {
    background: #eee;
    background: rgba(0, 0, 0, 0.05)
    }
.striped-vert tr > :first-child {
    background: #eee;
    background: rgba(0, 0, 0, 0.05)
    }
/*!
* www.KNACSS.com V3.0.3 (2014-05-19) @author: Raphael Goetter, Alsacreations
* Licence WTFPL http://www.wtfpl.net/
*/
/* ----------------------------- */
/* == soft reset                 */
/* ----------------------------- */
/* switching box model for all elements */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
    }
/* soft reset */
html, body {
    margin: 0;
    padding: 0
    }
ul, ol {
    padding-left: 2em
    }
ul.unstyled {
    list-style: none
    }
img {
    height: auto;
    vertical-align: middle;
    border: 0
    }
audio, canvas, video {
    display: inline-block
    }
svg:not(:root) {
    overflow: hidden
    }
/* ----------------------------- */
/* == typography                 */
/* ----------------------------- */
/* base font-size corresponds to "10px" and is adapted to rem unit */
html {
    /* set base font-size to equiv "10px", which is adapted to rem unit */
    font-size: 62.5%;
    /* IE9-IE11 math fixing. See http://bit.ly/1g4X0bX */
    /* thanks to @guardian, @victorbritopro and @eQRoeil */
    font-size: calc(1em * 0.625);
    /* disallow text zooming on orientation change (non standard property) */
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
    }
body {
    /* set body font-size in em (1.4em equiv "14px") */
    font-size: 1.4em;
    background-color: #fff;
    color: #000;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 1.5
    }
/* font-sizing for content */
p, .p-like, ul, ol, dl, blockquote, pre, td, th, label, textarea, caption, details, figure {
    margin-top: 0.75em;
    margin-bottom: 0;
    line-height: 1.5
    }
h1, .h1-like {
    font-size: 3.2rem
    }
h2, .h2-like {
    font-size: 2.8rem
    }
h3, .h3-like {
    font-size: 2.4rem
    }
h4, .h4-like {
    font-size: 2rem
    }
h5, .h5-like {
    font-size: 1.8rem
    }
h6, .h6-like {
    font-size: 1.6rem
    }
/* alternate font-sizing */
.smaller {
    font-size: 0.71em
    }
.small {
    font-size: 0.86em
    }
.big {
    font-size: 1.14em
    }
.bigger {
    font-size: 1.29em
    }
.biggest {
    font-size: 1.43em
    }
code, pre, samp, kbd {
    white-space: pre-line;
    /* IE fix */
    white-space: pre-wrap;
    font-family: Consolas, "DejaVu Sans Mono", Courier, monospace;
    line-height: normal
    }
em, .em, address, cite, dfn, i, var {
    font-style: italic
    }
.no-em {
    font-style: normal
    }
strong, .strong {
    font-weight: bold
    }
.no-strong {
    font-weight: normal
    }
small, sub, sup {
    font-size: smaller
    }
/* ----------------------------- */
/* == hiding content             */
/* ----------------------------- */
/* hidden but not for assistance tools, Yahoo! method */
.visually-hidden {
    position: absolute !important;
    border: 0 !important;
    height: 1px !important;
    width: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(1px, 1px, 1px, 1px) !important
    }
body > script {
    display: none !important
    }
@media (max-width: 480px) {
    .no-small-screen {
        display: none
        }
    }
@media (min-width: 1024px) {
    .no-large-screen {
        display: none
        }
    }
/* ----------------------------- */
/* == browsers consistency       */
/* ----------------------------- */
/* avoid top margins on first content element */
p:first-child, .p-like:first-child, ul:first-child, ol:first-child, dl:first-child, blockquote:first-child, pre:first-child, h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {
    margin-top: 0
    }
/* avoid margins on nested elements */
li p, li .p-like, li ul, li ol {
    margin-top: 0;
    margin-bottom: 0
    }
/* max values */
img, table, td, blockquote, code, pre, textarea, input, video {
    max-width: 100%
    }
/* margin-bottom on tables */
table {
    margin-bottom: 2em
    }
/* ----------------------------- */
/* ==layout and modules          */
/* ----------------------------- */
/* float layout */
/* module, gains superpower "BFC" Block Formating Context */
.mod {
    overflow: hidden
    }
/* blocks that needs to be placed under floats */
.clear, .line, .row {
    clear: both
    }
/* blocks that must contain floats */
.clearfix:after, .line:after {
    content: "";
    display: table;
    clear: both
    }
/* table layout */
.row {
    display: table;
    table-layout: fixed;
    width: 100%
    }
.row > *, .col {
    display: table-cell;
    vertical-align: top
    }
/* inline-block */
.inbl {
    display: inline-block;
    vertical-align: top
    }
/* alignments (blocks and inline) */
/* ------------------------------ */
/* left (or starting) elements */
.left, .start {
    float: left
    }
img.left, img.start {
    margin-right: 1em
    }
/* right (or ending) elements */
.right, .end {
    float: right
    }
img.right, img.end {
    margin-left: 1em
    }
img.left, img.right, img.start, img.end {
    margin-bottom: 0.5em
    }
.center {
    margin-left: auto;
    margin-right: auto
    }
.txtleft {
    text-align: left
    }
.txtright {
    text-align: right
    }
.txtcenter {
    text-align: center
    }
.w10 {
    width: 10%
    }
.w20 {
    width: 20%
    }
.w25 {
    width: 25%
    }
.w30 {
    width: 30%
    }
.w33 {
    width: 33.3333%
    }
.w40 {
    width: 40%
    }
.w50 {
    width: 50%
    }
.w60 {
    width: 60%
    }
.w66 {
    width: 66.6666%
    }
.w70 {
    width: 70%
    }
.w75 {
    width: 75%
    }
.w80 {
    width: 80%
    }
.w90 {
    width: 90%
    }
.w100 {
    width: 100%
    }
.w50p {
    width: 50px
    }
.w100p {
    width: 100px
    }
.w150p {
    width: 150px
    }
.w200p {
    width: 200px
    }
.w300p {
    width: 300px
    }
.w400p {
    width: 400px
    }
.w500p {
    width: 500px
    }
.w600p {
    width: 600px
    }
.w700p {
    width: 700px
    }
.w800p {
    width: 800px
    }
.w960p {
    width: 960px
    }
.mw960p {
    max-width: 960px
    }
.w1140p {
    width: 1140px
    }
.mw1140p {
    max-width: 1140px
    }
.wauto {
    width: auto
    }
.man {
    margin: 0
    }
.pan {
    padding: 0
    }
.mas {
    margin: 1em
    }
.mam {
    margin: 2em
    }
.mal {
    margin: 4em
    }
.pas {
    padding: 1em
    }
.pam {
    padding: 2em
    }
.pal {
    padding: 4em
    }
.mtn {
    margin-top: 0
    }
.mts {
    margin-top: 1em
    }
.mtm {
    margin-top: 2em
    }
.mtl {
    margin-top: 4em
    }
.mrn {
    margin-right: 0
    }
.mrs {
    margin-right: 1em
    }
.mrm {
    margin-right: 2em
    }
.mrl {
    margin-right: 4em
    }
.mbn {
    margin-bottom: 0
    }
.mbs {
    margin-bottom: 1em
    }
.mbm {
    margin-bottom: 2em
    }
.mbl {
    margin-bottom: 4em
    }
.mln {
    margin-left: 0
    }
.mls {
    margin-left: 1em
    }
.mlm {
    margin-left: 2em
    }
.mll {
    margin-left: 4em
    }
.ptn {
    padding-top: 0
    }
.pts {
    padding-top: 1em
    }
.ptm {
    padding-top: 2em
    }
.ptl {
    padding-top: 4em
    }
.prn {
    padding-right: 0
    }
.prs {
    padding-right: 1em
    }
.prm {
    padding-right: 2em
    }
.prl {
    padding-right: 4em
    }
.pbn {
    padding-bottom: 0
    }
.pbs {
    padding-bottom: 1em
    }
.pbm {
    padding-bottom: 2em
    }
.pbl {
    padding-bottom: 4em
    }
.pln {
    padding-left: 0
    }
.pls {
    padding-left: 1em
    }
.plm {
    padding-left: 2em
    }
.pll {
    padding-left: 4em
    }
/* ---------------------------------- */
/* ==classic grids                    */
/* .. use it when gutter size matters */
/* ---------------------------------- */
/* grids inspired from SUIT https://github.com/suitcss/suit */
/* overall container of grids */
.grid {
    overflow: hidden
    }
/* global styles for direct child ex. .grid3 */
.grid > * {
    display: block;
    padding: 0;
    /* gutter value */
    margin-left: -20px;
    text-align: left
    }
/* global styles for each "cell" */
.grid > * > * {
    display: inline-block;
    /* gutter value */
    padding-left: 20px;
    margin-left: 0;
    vertical-align: top
    }
/* whitespace fixing for modern browsers including IE9+ */
:root .grid {
    font-size: 0;
    /* fallback for IE9+ */
    text-justify: distribute-all-lines
    }
:root .grid > * > * {
    /* fallback for Opera Mini */
    font-size: 14px;
    font-size: 1.4rem
    }
/* Opera hack */
.opera:-o-prefocus, .grid > * {
    word-spacing: -0.43em
    }
.grid2 > * {
    width: 50%
    }
.grid3 > * {
    width: 33.333%
    }
.grid4 > * {
    width: 25%
    }
.grid5 > * {
    width: 20%
    }
.grid6 > * {
    width: 16.667%
    }
.grid8 > * {
    width: 12.5%
    }
.grid10 > * {
    width: 10%
    }
.grid12 > * {
    width: 8.333%
    }
/* unequal grids (1-2, 2-1, 1-3 and 3-1) for 2 blocks */
.grid2-1 > *:first-child, .grid1-2 > * + * {
    width: 66.666%
    }
.grid1-2 > *:first-child, .grid2-1 > * + * {
    width: 33.333%
    }
.grid1-3 > *:first-child, .grid3-1 > * + * {
    width: 25%
    }
.grid3-1 > *:first-child, .grid1-3 > * + * {
    width: 75%
    }
/* Responsiv-o-matic */
@media (max-width: 1024px) {
    .grid5 > *, .grid6 > *, .grid8 > *, .grid10 > *, .grid12 > * {
        width: 33.333%
        }
    }
@media (max-width: 480px) {
    .grid3 > *, .grid4 > *, .grid5 > *, .grid6 > *, .grid8 > *, .grid10 > *, .grid12 > * {
        width: 50%
        }
    }
@media (max-width: 320px) {
    .grid > * > * {
        width: 100% !important
        }
    }
/* ---------------------------------- */
/* ==autogrids                        */
/* .. to automatically justify blocs  */
/* ---------------------------------- */
/* Demo : http://codepen.io/raphaelgoetter/pen/Kqehf */
/* container of autogrids */
[class*="autogrid"] {
    text-align: justify
    }
[class*="autogrid"]:after {
    content: "";
    display: inline-block;
    width: 100%
    }
[class*="autogrid"] > * {
    display: inline-block;
    vertical-align: top;
    text-align: left
    }
/* whitespace fixing for modern browsers including IE9+ */
:root[class*="autogrid"] {
    font-size: 0;
    /* fallback for IE9+ */
    text-justify: distribute-all-lines
    }
:root[class*="autogrid"] > * {
    /* fallback for Opera Mini */
    font-size: 14px;
    font-size: 1.4rem
    }
/* Opera hack */
[class*="autogrid"]:-o-prefocus {
    word-spacing: -0.43em
    }
.autogrid2 > * {
    width: 49%
    }
.autogrid3 > * {
    width: 32%
    }
.autogrid4 > * {
    width: 23.6%
    }
.autogrid5 > * {
    width: 19%
    }
.autogrid6 > * {
    width: 15%
    }
.autogrid8 > * {
    width: 10.8%
    }
.autogrid10 > * {
    width: 9%
    }
.autogrid12 > * {
    width: 6.4%
    }
@media (max-width: 1024px) {
    .autogrid5 > *, .autogrid6 > *, .autogrid8 > *, .autogrid10 > *, .autogrid12 > * {
        width: 32%
        }
    }
@media (max-width: 480px) {
    .autogrid5 > *, .autogrid6 > *, .autogrid8 > *, .autogrid10 > *, .autogrid12 > * {
        width: 49%
        }
    }
@media (max-width: 320px) {
    [class*="autogrid"] > * {
        width: 100%
        }
    }
/* ----------------------------- */
/* ==tables                      */
/* ----------------------------- */
table, .table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    vertical-align: top;
    border: 1px solid #ccc
    }
.table {
    display: table
    }
table#recaptcha_table, table.table-auto {
    table-layout: auto
    }
caption {
    padding: 1em;
    color: #555;
    font-style: italic
    }
td, th {
    padding: 0.3em 0.8em;
    border: 1px #aaa dotted;
    vertical-align: top;
    min-width: 2em;
    cursor: default;
    text-align: left
    }
/* ----------------------------- */
/* ==forms                       */
/* ----------------------------- */
/* thanks to HTML5boilerplate,
* github.com/nathansmith/formalize and www.sitepen.com
*/
/* buttons */
.btn {
    display: inline-block
    }
/* forms items */
form, fieldset {
    border: none
    }
input, button, select, label, .btn {
    vertical-align: middle;
    font-family: inherit;
    font-size: inherit
    }
label {
    display: inline-block;
    vertical-align: middle;
    cursor: pointer
    }
legend {
    border: 0;
    white-space: normal
    }
textarea {
    min-height: 5em;
    vertical-align: top;
    font-family: inherit;
    font-size: inherit;
    resize: vertical
    }
/* clickable input types in iOS */
button, input[type="button"], input[type="reset"], input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button
    }
input[type="search"] {
    -webkit-appearance: textfield
    }
/* if select styling bugs on WebKit */
/* 'x' appears on right of search input when text is entered. This removes it */
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
    }
::-webkit-input-placeholder {
    color: #777
    }
input:-moz-placeholder, textarea:-moz-placeholder {
    color: #777
    }
/* Removes inner padding and border in FF3+ */
button::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner {
    border: 0;
    padding: 0
    }
/* ----------------------------- */
/* ==icons and bullets	         */
/* ----------------------------- */
.icon {
    display: inline-block
    }
.icon:before, .icon.after:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -0.1em;
    margin: 0 0.3em 0 0;
    font: 1.4em/1 sans-serif;
    color: #000;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.1);
    speak: none
    }
@media (min-device-width: 480px) {
    .icon:before, .icon.after:after {
        font: 1em/0.6 sans-serif;
        -webkit-transform: rotatez(0.05deg)
        }
    }
.icon.after:after {
    margin: 0 0 0 8px
    }
.icon.after:before {
    content: "" !important
    }
.icon-rate:before, .icon-rate.after:after {
    content: "★"
    }
.icon-unrate:before, .icon-unrate.after:after {
    content: "☆"
    }
.icon-check:before, .icon-check.after:after {
    content: "✓"
    }
.icon-uncheck:before, .icon-uncheck.after:after {
    content: "✗"
    }
.icon-cloud:before, .icon-cloud.after:after {
    content: "☁"
    }
.icon-dl:before, .icon-dl.after:after {
    content: "⇣";
    font-weight: bold
    }
.icon-cross:before, .icon-cross.after:after {
    content: "✖";
    font-weight: bold
    }
.icon-arrow1:before, .icon-arrow1.after:after {
    content: "→";
    position: relative;
    top: -0.15em
    }
.icon-arrow2:before, .icon-arrow2.after:after {
    content: "➞"
    }
.icon-arrow3:before, .icon-arrow3.after:after {
    content: "➚"
    }
.icon-bracket1:before, .icon-bracket1.after:after {
    content: "‹";
    font-weight: bold;
    font-size: 1.6em;
    position: relative;
    top: -0.15em
    }
.icon-bracket2:before, .icon-bracket2.after:after {
    content: "›";
    font-weight: bold;
    font-size: 1.6em;
    position: relative;
    top: -0.15em
    }
.icon-up:before, .icon-up.after:after {
    content: "▲"
    }
.icon-down:before, .icon-down.after:after {
    content: "▼"
    }
.icon-bull:before, .icon-bull.after:after {
    content: "•";
    font-size: 1.2em;
    top: -0.05em
    }
.icon-bull2:before, .icon-bull2.after:after {
    content: "◦";
    top: -0.05em
    }
.icon-bull3:before, .icon-bull3.after:after {
    content: "‣";
    font-size: 1.6em;
    top: -0.05em
    }
.icon-nav:before, .icon-nav.after:after {
    content: "≡";
    font-weight: bold
    }
.icon-losange:before, .icon-losange.after:after {
    content: "◆"
    }
.icon-asteri:before, .icon-asteri.after:after {
    content: "✱";
    font-weight: bold
    }
.icon-mail:before, .icon-mail.after:after {
    content: "✉";
    font-size: 1.6em;
    top: -0.05em
    }
/* ----------------------------- */
/* ==desktop and HD devices      */
/* ----------------------------- */
@media (min-width: 480px) {
    /* 
    	rules for big resources and big screens like: background-images, font-faces, etc. */
    }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
    /* style adjustments for high density devices */
    }
/* ---------------------------------- */
/* ==Responsive large / small / tiny  */
/* ---------------------------------- */
@media (min-width: 1024px) {
    /* layouts for large screens */
    .large-hidden {
        display: none !important
        }
    .large-visible {
        display: block !important
        }
    .large-no-float {
        float: none
        }
    .large-inbl {
        display: inline-block;
        float: none;
        vertical-align: top
        }
    .large-row {
        display: table;
        table-layout: fixed;
        width: 100% !important
        }
    .large-col {
        display: table-cell;
        vertical-align: top
        }
    /* widths for large screens */
    .large-w25 {
        width: 25% !important
        }
    .large-w33 {
        width: 33.3333% !important
        }
    .large-w50 {
        width: 50% !important
        }
    .large-w66 {
        width: 66.6666% !important
        }
    .large-w75 {
        width: 75% !important
        }
    .large-w100, .large-wauto {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0
        }
    /* margins for large screens */
    .large-man {
        margin: 0 !important
        }
    }
@media (max-width: 480px) {
    /* quick reset in small resolution and less */
    .w600p, .w700p, .w800p, .w960p, .mw960p {
        width: auto;
        float: none
        }
    /* layouts for small screens */
    .small-hidden {
        display: none !important
        }
    .small-visible {
        display: block !important
        }
    .small-no-float {
        float: none
        }
    .small-inbl {
        display: inline-block;
        float: none;
        vertical-align: top
        }
    .small-row {
        display: table !important;
        table-layout: fixed !important;
        width: 100% !important
        }
    .small-col {
        display: table-cell !important;
        vertical-align: top !important
        }
    /* widths for small screens */
    .small-w25 {
        width: 25% !important
        }
    .small-w33 {
        width: 33.3333% !important
        }
    .small-w50 {
        width: 50% !important
        }
    .small-w66 {
        width: 66.6666% !important
        }
    .small-w75 {
        width: 75% !important
        }
    .small-w100, .small-wauto {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0
        }
    /* margins for small screens */
    .small-man {
        margin: 0 !important
        }
    .small-pan {
        padding: 0 !important
        }
    }
@media (max-width: 320px) {
    /* quick tiny resolution reset */
    .mod, .col, fieldset {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0
        }
    .w300p, .w400p, .w500p {
        width: auto;
        float: none
        }
    .row {
        display: block !important;
        width: 100% !important
        }
    /* layouts for tiny screens */
    .tiny-hidden {
        display: none !important
        }
    .tiny-visible {
        display: block !important
        }
    .tiny-no-float {
        float: none
        }
    .tiny-inbl {
        display: inline-block;
        float: none;
        vertical-align: top
        }
    .tiny-row {
        display: table !important;
        table-layout: fixed !important;
        width: 100% !important
        }
    .tiny-col {
        display: table-cell !important;
        vertical-align: top !important
        }
    th, td {
        display: block !important;
        width: auto !important;
        text-align: left !important
        }
    thead {
        display: none
        }
    /* widths for tiny screens */
    .tiny-w25 {
        width: 25% !important
        }
    .tiny-w33 {
        width: 33.3333% !important
        }
    .tiny-w50 {
        width: 50% !important
        }
    .tiny-w66 {
        width: 66.6666% !important
        }
    .tiny-w75 {
        width: 75% !important
        }
    .tiny-w100, .tiny-wauto {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0
        }
    /* margins for tiny screens */
    .tiny-man {
        margin: 0 !important
        }
    .tiny-pan {
        padding: 0 !important
        }
    }
/* flexbox layout 
Tutorial: http://knacss.com/demos/tutoriel.html#flex */
.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex
    }
.flex-h {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
    }
.flex-v {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
    }
.flex-fluid {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1
    }
.flex-start {
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -moz-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1
    }
.flex-mid {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -moz-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
    }
.flex-end {
    -webkit-box-ordinal-group: 43;
    -webkit-order: 42;
    -moz-box-ordinal-group: 43;
    -ms-flex-order: 42;
    order: 42
    }
/* quick print reset */
@media print {
    * {
        background: transparent !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important
        }
    body {
        width: auto !important;
        margin: auto !important;
        font-family: serif;
        font-size: 12pt;
        background-color: #fff !important;
        color: #333 !important
        }
    p, h1, h2, h3, h4, h5, h6, blockquote, ul, ol {
        color: #000 !important;
        margin: auto !important
        }
    .print {
        display: block
        }
    .no-print {
        display: none
        }
    img {
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%)
        }
    /* no orphans, no widows */
    p, blockquote {
        orphans: 3;
        widows: 3
        }
    /* no breaks inside these elements */
    blockquote, ul, ol {
        page-break-inside: avoid
        }
    /* page break before main headers */
    h1 {
        page-break-before: always
        }
    /* no breaks after these elements */
    h1, h2, h3, caption {
        page-break-after: avoid
        }
    a {
        color: #000 !important;
        text-decoration: underline !important
        }
    /* displaying URLs */
    a[href]:after {
        content: " (" attr(href) ")"
        }
    a[href^="javascript:"]:after, a[href^="#"]:after {
        content: ""
        }
    }
/* ----------------------------- */
/* ==booleans                    */
/* ----------------------------- */
.skip-links {
    position: absolute
    }
.skip-links a {
    position: absolute;
    left: -7000px;
    padding: 0.5em;
    background: black;
    color: white;
    text-decoration: none
    }
.skip-links a:focus {
    position: static
    }
@media (max-width: 480px) {
    /* you shall not pass */
    div, textarea, table, td, th, code, pre, samp {
        word-wrap: break-word;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto
        }
    }
/* ----------------------------- */
/* ==gmaps support               */
/* ----------------------------- */
.gm-style img {
    height: 100%
    }
:not(.gm-style) img {
    height: auto
    }
.gm-style img, .gmnoscreen img, .gmnoprint img {
    max-width: none !important
    }
/* ----------------------------- */
/* ==IE6, IE7, IE8 support       */
/* ----------------------------- */
.ie678 h1, .ie678 .h1-like {
    font-size: 2.29em
    }
.ie678 h2, .ie678 .h2-like {
    font-size: 2em
    }
.ie678 h3, .ie678 .h3-like {
    font-size: 1.71em
    }
.ie678 h4, .ie678 .h4-like {
    font-size: 1.43em
    }
.ie678 h5, .ie678 .h5-like {
    font-size: 1.29em
    }
.ie678 h6, .ie678 .h6-like {
    font-size: 1.14em
    }
.ie678 img {
    width: auto;
    /* @bugfix for IE8 */
    }
.ie678 .gm-style img {
    height: 100%
    }
.ie8 .grid > *, .ie8[class*="autogrid"] > * {
    letter-spacing: -0.31em;
    text-rendering: optimizespeed
    }
.ie8 .grid > * > *, .ie8[class*="autogrid"] > * > * {
    letter-spacing: normal;
    word-spacing: normal;
    text-rendering: auto
    }
.ie678 input[type="checkbox"], .ie678 input[type="radio"] {
    padding: 0
    }
.ie678 textarea {
    overflow: auto
    }
/* ----------------------------- */
/* ==minor stylings              */
/* ----------------------------- */
code, kbd, mark {
    border-radius: 2px
    }
kbd {
    padding: 0 2px;
    border: 1px solid #999
    }
code {
    padding: 2px 4px;
    background: rgba(0, 0, 0, 0.04);
    color: #b11
    }
pre code {
    padding: none;
    background: none;
    color: inherit;
    border-radius: 0
    }
mark {
    padding: 2px 4px;
    background: #ff0
    }
sup, sub {
    vertical-align: 0;
    position: relative
    }
sup {
    bottom: 1ex
    }
sub {
    top: 0.5ex
    }
blockquote {
    margin-left: 0;
    padding-left: 1em;
    border-left: 4px solid rgba(0, 0, 0, 0.15);
    font-style: italic
    }
q {
    font-style: normal
    }
q, .q {
    quotes: "“ " " â€"
    }
q:lang(fr), .q:lang(fr) {
    quotes: "« " " Â»"
    }
hr {
    display: block;
    clear: both;
    height: 1px;
    margin: 1em 0 2em;
    padding: 0;
    border: 0;
    color: #ccc;
    background-color: #ccc
    }
.alternate {
    border: 0
    }
.alternate tbody {
    border: 1px solid #ccc
    }
.alternate thead tr > * + * {
    border-left: 0
    }
.alternate tbody tr > * + * {
    border-left: 1px solid #ccc
    }
.alternate-vert {
    border: 0;
    border-right: 1px solid #ccc
    }
.alternate-vert tr > :first-child {
    border-bottom: 0
    }
.alternate-vert tr > * + * {
    border-top: 1px solid #ccc
    }
.striped tbody tr:nth-child(odd) {
    background: #eee;
    background: rgba(0, 0, 0, 0.05)
    }
.striped-vert tr > :first-child {
    background: #eee;
    background: rgba(0, 0, 0, 0.05)
    }
/* ----------------------------- */
/* ==own stylesheet              */
/* ----------------------------- */
/* Here should go your own CSS styles */
/* You can also link them with a LESS @import ../bundles/sqlifontevraud/desktop/css/*/
/* @import "../bundles/sqlifontevraud/desktop/css/my-styles.less"; */
/* ----------------------------- */
/* == FONTS                      */
/* ----------------------------- */
@font-face {
    font-family: "apercu_promedium";
    src: url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_medium_pro-webfont.eot);
    src: url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_medium_pro-webfont.eot?#iefix) format("embedded-opentype"), url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_medium_pro-webfont.woff) format("woff"), url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_medium_pro-webfont.ttf) format("truetype"), url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_medium_pro-webfont.svg#apercu_promedium) format("svg");
    font-weight: normal;
    font-style: normal;
    -webkit-transform: rotate(-0.0deg);
    -webkit-font-smoothing: antialiased
    }
@font-face {
    font-family: "apercu_prolight";
    src: url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_light_pro_72-webfont.eot);
    src: url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_light_pro_72-webfont.eot?#iefix) format("embedded-opentype"), url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_light_pro_72-webfont.woff) format("woff"), url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_light_pro_72-webfont.ttf) format("truetype"), url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_light_pro_72-webfont.svg#apercu_prolight) format("svg");
    font-weight: normal;
    font-style: normal;
    -webkit-transform: rotate(-0.0deg);
    -webkit-font-smoothing: subpixel-antialiased
    }
@font-face {
    font-family: "apercu_probold";
    src: url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_bold_pro-webfont.eot);
    src: url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_bold_pro-webfont.eot?#iefix) format("embedded-opentype"), url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_bold_pro-webfont.woff) format("woff"), url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_bold_pro-webfont.ttf) format("truetype"), url(../bundles/sqlifontevraud/desktop/css/fonts/apercu_bold_pro-webfont.svg#apercu_prolight) format("svg");
    font-weight: normal;
    font-style: normal;
    -webkit-transform: rotate(-0.0deg);
    -webkit-font-smoothing: subpixel-antialiased
    }
strong {
    font-weight: normal;
    font-family: "apercu_probold", helvetica, sans-serif, arial !important
    }
/* ----------------------------- */
/* == Wrappers                   */
/* ----------------------------- */
html {
    height: 100%;
    background-color: #262626
    }
.general-wrapper {
    max-width: 100%;
    min-width: 768px;
    margin: 0 auto 0 auto
    }
.util-wrapper {
    max-width: 1200px;
    min-width: 768px;
    margin: 0 auto 0 auto
    }
/* ----------------------------- */
/* == Header                     */
/* ----------------------------- */
.header-top {
    height: 98px
    }
.header-top .logo {
    display: block;
    max-width: 224px;
    height: 98px;
    background: url(../bundles/sqlifontevraud/desktop/img/logo-abbaye-de-fontevraud.png) no-repeat center center;
    background-size: cover
    }
.header-menu-top li + li {
    padding-top: 27px;
    text-transform: uppercase;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.05em;
    line-height: 1.3em;
    -webkit-transition: all 250ms ease;
    -moz-transition: all 250ms ease;
    -ms-transition: all 250ms ease;
    -o-transition: all 250ms ease;
    transition: all 250ms ease;
    cursor: pointer
    }
.header-menu-top li + li a {
    display: block;
    -webkit-transition: all 250ms ease;
    -moz-transition: all 250ms ease;
    -ms-transition: all 250ms ease;
    -o-transition: all 250ms ease;
    transition: all 250ms ease
    }
.header-menu-top .bl {
    border-left: 4px #262626 solid
    }
/*  li a 2, 3 et 4 */
.header-menu-top li:first-child + li a, .header-menu-top li:first-child + li + li a {
    width: 75%;
    margin: 0 auto 0 20%
    }
.header-menu-top li:first-child + li + li + li a {
    width: 80%;
    margin: 0 auto 0 17%
    }
/* hover li 2 et 3 */
.header-menu-top li:first-child + li:hover, .header-menu-top li:first-child + li + li:hover, .header-menu-top li.active {
    background: white
    }
/* hover li a 2 et 3 */
.header-menu-top li:first-child + li:hover a, .header-menu-top li:first-child + li + li:hover a, .header-menu-top li.active a {
    color: #000
    }
/* hover li 4 */
.header-menu-top li:first-child + li + li + li:hover {
    background: #00a3ff
    }
/* hover li a 4 */
.header-menu-top li:first-child + li + li + li:hover a span {
    color: #FFF
    }
.header-menu-top li:first-child + li + li + li:hover a span:first-child {
    color: #000
    }
.header-menu-top .raisonsdevenir span {
    display: block
    }
/* connexion */
.header-menu-top li:last-child .connexion {
    display: block;
    margin-top: -10px;
    position: relative
    }
.header-menu-top li:last-child .connexion:before {
    content: " ";
    width: 15px;
    height: 18px;
    display: inline-block;
    margin-right: 6px;
    position: relative;
    top: 1px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -22px 0
    }
.header-menu-top li:last-child .connexion:hover {
    color: white
    }
.header-menu-top .raisonsdevenir span:first-child {
    color: white
    }
.header-menu-top .raisonsdevenir span:last-child {
    color: #00a3ff
    }
.header-menu-top .switch-lang {
    height: 27px;
    line-height: 27px;
    margin-top: 10px
    }
.header-menu-top .switch-lang a {
    display: inline-block;
    position: relative;
    width: auto !important;
    margin: 0 !important;
    padding-left: 6px
    }
.header-menu-top .txtright:hover {
    background: none !important;
    color: #a8a8a8 !important
    }
.header-menu-top .txtright:hover a {
    color: #a8a8a8 !important
    }
.header-menu-top .txtright:hover a.on {
    color: #00a3ff !important
    }
.header-menu-top .txtright a:hover {
    color: #32538b !important
    }
.header-menu-top .switch-lang a.on {
    color: #00a3ff
    }
.header-menu-top .switch-lang a:hover {
    color: white
    }
.header-menu-top .switch-lang a:first-child {
    margin-right: 6px;
    padding-right: 10px
    }
.header-menu-top .switch-lang a:first-child:after {
    content: " ";
    border-left: 1px white solid;
    height: 27px;
    position: absolute;
    right: 0;
    top: 0
    }
/* ---------------------------------- */
/* == Menu déroulant                  */
/* ---------------------------------- */
.header-menu-slider {
    height: 190px;
    max-height: 190px;
    overflow: hidden;
    width: 100%;
    display: none
    }
.header-menu-slider ul {
    display: table
    }
.header-menu-slider li {
    display: table-cell;
    height: 190px;
    vertical-align: top
    }
.header-menu-slider .picto-link:first-child, .header-menu-slider .link-txt-bl:first-child {
    margin-top: 40px
    }
.header-menu-slider li.message-left {
    width: 16%
    }
.header-menu-slider li.message-right {
    width: 19%
    }
a.picto-link, a.link-txt-bl {
    display: block;
    position: relative;
    height: 40px;
    overflow: hidden;
    color: #000;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    text-transform: uppercase;
    font-size: 1.2em;
    line-height: 1.2em;
    padding-right: 5px
    }
.header-menu-slider a.link-txt-bl {
    margin-bottom: 26px
    }
.header-menu-slider .picto-link {
    padding-left: 44px;
    margin-bottom: 26px
    }
.header-menu-slider .picto-link:before {
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat;
    content: " ";
    position: absolute;
    left: 0
    }
.header-menu-slider .agenda:before {
    width: 27px;
    height: 34px;
    top: 4px;
    left: 4px;
    background-position: -58px 0
    }
.header-menu-slider .infos-pratiques:before {
    width: 38px;
    height: 36px;
    top: 4px;
    background-position: -106px 0
    }
.header-menu-slider .billet:before {
    width: 37px;
    height: 34px;
    top: 4px;
    left: 0;
    background-position: -201px 0
    }
.header-menu-slider .offrir:before {
    width: 28px;
    height: 33px;
    top: 4px;
    left: 4px;
    background-position: -159px 0
    }
.header-menu-slider .agenda:hover:before {
    background-position: -58px -48px
    }
.header-menu-slider .infos-pratiques:hover:before {
    background-position: -106px -48px
    }
.header-menu-slider .billet:hover:before {
    background-position: -201px -49px
    }
.header-menu-slider .offrir:hover:before {
    background-position: -159px -47px
    }
.link-txt-bl {
    padding-left: 17px
    }
.link-txt-bl:before {
    content: " ";
    width: 1px;
    height: 38px;
    position: absolute;
    left: 0;
    top: 2px;
    background: #000
    }
.header-menu-slider .link-txt-bl:hover:before {
    background: #32538b
    }
.message-left {
    background: #e3e3e3;
    padding: 40px 10px 0 10px;
    color: #000;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.1em;
    text-transform: uppercase
    }
.message-left span {
    display: block
    }
.message-left .horaires {
    margin-top: 10px;
    font-size: 1.6em;
    line-height: 1em;
    text-transform: none
    }
.message-right {
    font-size: 1.1em;
    background: #898989;
    padding: 40px 10px 0 10px;
    color: #FFF;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    text-transform: uppercase
    }
.message-right .bigger {
    font-size: 1.7em;
    line-height: 1em
    }
.message-right .link-article {
    display: inline-block;
    position: relative;
    top: 10px;
    padding-right: 30px;
    color: #FFF;
    text-transform: uppercase;
    font-size: 0.95em
    }
.message-right .link-article:after {
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat 0 -35px;
    display: block;
    content: " ";
    width: 23px;
    height: 23px;
    position: absolute;
    right: 0;
    top: 0
    }
.message-right .link-article:hover {
    color: #32538b
    }
.message-right .link-article:hover:after {
    background-position: 0 -60px
    }
.close-menu-slider {
    width: 48px;
    height: 190px;
    position: relative
    }
.close-menu-slider a {
    display: block;
    height: 48px;
    width: 48px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat;
    background-position: -264px 2px;
    margin: 0 !important;
    position: absolute;
    bottom: 0;
    z-index: 1000
    }
.close-menu-slider:hover a {
    background-position: -264px -48px
    }
/* ---------------------------------- */
/* == Cartouche top                   */
/* ---------------------------------- */
.cartouche-top .sous-menu {
    margin-top: 22px
    }
.cartouche-top .sous-menu a {
    position: relative;
    font-family: "apercu_prolight", helvetica, sans-serif, arial;
    font-size: 1.17em;
    color: #000;
    padding-left: 10px;
    padding-right: 10px;
    -webkit-transition: all 250ms ease;
    -moz-transition: all 250ms ease;
    -ms-transition: all 250ms ease;
    -o-transition: all 250ms ease;
    transition: all 250ms ease
    }
.cartouche-top .sous-menu a:hover, .cartouche-top .sous-menu a.active {
    color: #EC7217
    }
.cartouche-top .h1-txt {
    font-family: "apercu_prolight", helvetica, sans-serif, arial;
    text-transform: uppercase;
    padding: 0 0 0 10px;
    margin: -20px 0 10px 0
    }
.h1-txt {
    font-family: "apercu_prolight", helvetica, sans-serif, arial;
    text-transform: uppercase;
    margin: -20px 0 10px 0
    }
.cartouche-top .h1-img {
    margin: 14px 0 32px 10px;
    padding: 0
    }
.en-ce-moment {
    background: #32538b
    }
.en-ce-moment figure {
    margin: 0 0 15px 0;
    padding: 0
    }
.en-ce-moment figcaption {
    text-transform: uppercase;
    color: white;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.2em;
    padding-top: 5px
    }
.en-ce-moment nav li {
    margin-bottom: 10px
    }
.en-ce-moment + .sous-menu {
    margin-top: 10px
    }
.en-ce-moment .h1-like {
    padding: 25px 0 9px 0;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 2em;
    text-transform: uppercase;
    color: white;
    display: block
    }
/* ---------------------------------- */
/* == Medias / caroussel / slider     */
/* ---------------------------------- */
.medias-show {
    position: relative;
    overflow: hidden;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    margin-top: 15px
    }
.medias-show.medias-full-width img {
    width: 100%;
    max-width: 100%;
    height: auto
    }
.medias-show .infos-left, .medias-show .infos-right {
    position: absolute;
    top: 0;
    width: 49%;
    color: white
    }
.medias-show .infos-right {
    left: 56%
    }
.medias-show .infos-left {
    left: -5%;
    text-align: right
    }
.medias-show .layer-bkg {
    position: absolute;
    background: black;
    -moz-opacity: 0.3;
    -khtml-opacity: 0.3;
    opacity: 0.3
    }
.medias-show .infos-right .layer-bkg {
    width: 120%;
    -webkit-transform: skewx(15deg);
    -moz-transform: skewx(15deg);
    -o-transform: skewx(15deg);
    -ms-transform: skewx(15deg);
    transform: skewx(15deg)
    }
.medias-show .infos-left .layer-bkg {
    width: 100%;
    -webkit-transform: skewx(-15deg);
    -moz-transform: skewx(-15deg);
    -o-transform: skewx(-15deg);
    -ms-transform: skewx(-15deg);
    transform: skewx(-15deg)
    }
.medias-show .infos-left .title, .medias-show .infos-right .title {
    position: absolute;
    top: 180px;
    width: 75%;
    text-transform: uppercase;
    margin-left: 50px
    }
.medias-show .infos-right h2.title {
    text-transform: none
    }
#layerslider h1, #layerslider h2 {
    width: auto
    }
.medias-show a, .medias-show a:hover {
    color: white
    }
.medias-show .infos-left .title {
    width: 85%;
    padding-right: 20px
    }
.medias-show h1, .medias-show h2, .medias-show h5 {
    font-size: 2.4em;
    line-height: 1.2em;
    color: white
    }
.medias-show h1 + h2 {
    font-size: 1.5em;
    margin-top: 7px
    }
.medias-show p {
    font-size: 1.5em
    }
.medias-show .play-video {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    cursor: pointer
    }
.medias-show .play-video:before {
    content: " ";
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -322px 0;
    display: block;
    position: absolute;
    left: 45%;
    top: 42%;
    width: 100px;
    height: 100px
    }
.medias-show .play-video:hover:before {
    background-position: -322px -110px
    }
.medias-show .lien-interne:before {
    content: " ";
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -525px -135px;
    display: block;
    position: absolute;
    left: 45%;
    top: 38%;
    width: 58px;
    height: 58px
    }
.medias-show .lien-interne:hover:before {
    background-position: -525px -194px
    }
.video-thumbs a, .video-thumbs a:hover {
    position: relative;
    color: white
    }
.video-thumbs .play-video:before {
    content: " ";
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -443px 0;
    display: block;
    position: absolute;
    left: 40%;
    top: 28%;
    width: 58px;
    height: 58px
    }
.video-thumbs a:hover .play-video:before {
    background-position: -443px -60px
    }
.video-thumbs .lien-interne:before {
    content: " ";
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -525px -135px;
    display: block;
    position: absolute;
    left: 40%;
    top: 28%;
    width: 58px;
    height: 58px
    }
.video-thumbs a:hover .lien-interne:before {
    background-position: -525px -194px
    }
.video-thumbs .thumb-text {
    position: absolute;
    margin: 0;
    padding: 5px 5px 5px 10px;
    bottom: 0;
    left: 0;
    right: 0;
    text-transform: uppercase;
    background-color: rgb(0, 0, 0);
    /* alternative solide */
    background-color: rgba(0, 0, 0, 0.5);
    zoom: 1
    }
.video-thumbs .thumb-text h3 {
    margin: 0;
    padding: 0 0 10px 0;
    bottom: 0;
    left: 0;
    right: 0;
    font-size: 1.1em
    }
.video-thumbs .thumb-text p {
    margin: 0;
    padding: 0;
    font-size: 1em
    }
/* cas 3 thumbs vidéos */
.videoWrapperX3 {
    max-width: 900px
    }
/* cas 3 thumbs vidéos */
.videoWrapperX2 {
    min-width: 291px;
    max-width: 593px
    }
/* cas 3 thumbs vidéos */
.videoWrapperX1 {
    max-width: 291px;
    min-width: 291px
    }
/*
	- Slidewhow + navigation
	- root element
*/
/*
.slideshow {
    position:relative;
    overflow:hidden;
}
.slideshow .items {
    width:20000em;
    position:absolute;
    clear:both;
}

.slideshow div.item-content{
    float:left;
    margin: 0;
    background-color:#fff;
    position:relative;
    cursor : pointer
}
.slideshow .active {
    border:2px solid #000;
    position:relative;
    cursor:default;
}
.slideshow {
    float:left;
}
*/
.ls-bottom-nav-wrapper {
    left: 20%
    }
.navi {
    width: 25%;
    height: 20px;
    position: absolute;
    z-index: 1000;
    bottom: 10px;
    right: 0
    }
.navi a, .ls-bottom-slidebuttons a {
    width: 9px !important;
    height: 9px !important;
    float: left;
    margin: 5px;
    border: 1px white solid !important;
    display: block !important;
    font-size: 1px !important;
    cursor: pointer;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px !important;
    background: none !important
    }
.navi a:hover, .ls-bottom-slidebuttons a:hover {
    background: #4d4d4d !important
    }
.navi a.active, .ls-bottom-slidebuttons a.ls-nav-active {
    border: none;
    background: white !important
    }
.ls-v5 .ls-bottom-slidebuttons, .ls-v5 .ls-nav-start, .ls-v5 .ls-nav-stop, .ls-v5 .ls-nav-sides {
    top: -30px
    }
.ls-v5 .ls-bottom-slidebuttons, .ls-v5 .ls-bottom-slidebuttons a, .ls-v5 .ls-nav-start, .ls-v5 .ls-nav-stop, .ls-v5 .ls-nav-sides {
    display: inline-block
    }
/* ----------------------------- */
/* == Themes laucher             */
/* ----------------------------- */
.univers-launcher {
    padding: 12px 0 0 0;
    width: 100%
    }
.univers-launcher a {
    position: relative;
    top: 5px
    }
.univers-launcher .hover {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
    }
/* ----------------------------- */
/* == Page content               */
/* ----------------------------- */
.page-content {
    margin-top: 35px;
    margin-bottom: 80px;
    font-family: "apercu_prolight", helvetica, sans-serif, arial
    }
.content-left {
    padding-right: 75px
    }
.content-right {
    width: 350px
    }
.page-content h2 {
    font-size: 1.8em;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    line-height: 1em;
    text-transform: uppercase;
    font-weight: normal
    }
h2.seo-friendly {
    font-size: 1.8em;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    line-height: 1em;
    text-transform: uppercase;
    font-weight: normal
    }
.h2-like.seo-friendly, h2.seo-friendly {
    font-size: 1.8em;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    line-height: 1em;
    text-transform: uppercase;
    font-weight: normal
    }
.page-content h2.big {
    text-transform: uppercase;
    font-size: 3em;
    line-height: 1.2em;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    margin-bottom: 15px
    }
.page-content p {
    color: #666;
    font-size: 1.1em
    }
.page-content p a {
    color: #00a3ff;
    font-weight: bold
    }
.details-evenement {
    padding: 15px;
    background: #ededed;
    text-transform: uppercase
    }
.details-evenement .col {
    padding-right: 15px
    }
.details-evenement span {
    display: block;
    margin-bottom: 10px
    }
.details-evenement strong {
    font-family: "apercu_promedium", helvetica, sans-serif, arial
    }
/* ---------------------------------- */
/* == Liens & boutons                 */
/* ---------------------------------- */
a {
    text-decoration: none
    }
a:hover, a:active {
    color: #EC7217
    }
a.on, .cartouche-top .sous-menu a.on {
    color: #EC7217
    }
a:hover:before, a:hover:after {
    color: #EC7217
    }
.butt-classic {
    position: relative;
    padding: 10px 15px 9px 10px;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.3em;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-align: left;
    line-height: 1em;
    display: inline-block
    }
.butt-icon {
    position: relative;
    display: block;
    height: 41px;
    line-height: 41px !important;
    padding: 0 50px 0 18px;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    text-transform: uppercase;
    font-size: 1.3em;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: white;
    text-align: left
    }
.butt-white {
    background: white;
    color: #32538b
    }
.butt-blue, .butt-b-to-w {
    background: #32538b;
    color: white
    }
button.butt-blue {
    border: none
    }
.butt-blue:hover, .butt-white:hover, .butt-blue:active, .butt-white:active {
    background: black;
    color: white
    }
.butt-b-to-w:hover, .butt-b-to-w:active {
    background: white;
    color: #32538b !important
    }
.butt-grey {
    background: #4d4d4d
    }
.butt-grey-bright {
    background: #666
    }
.butt-grey:hover, .butt-grey:active, .butt-grey-bright:hover, .butt-grey-bright:active {
    background: black;
    color: white
    }
.icon-right-arrowtoright:after {
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat 0 -88px;
    display: block;
    content: " ";
    width: 30px;
    height: 30px;
    position: absolute;
    right: 11px;
    top: 6px
    }
.butt-b-to-w.icon-right-arrowtoright:hover:after {
    background-position: 0 -125px
    }
.icon-right-arrowtobottom:after {
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -173px -166px;
    display: block;
    content: " ";
    width: 30px;
    height: 30px;
    position: absolute;
    right: 11px;
    top: 6px
    }
.icon-right-phone:after {
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat 0 -284px;
    display: block;
    content: " ";
    width: 22px;
    height: 28px;
    position: absolute;
    right: 14px;
    top: 6px
    }
.icon-right-moreinfos:after {
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -340px -299px;
    display: block;
    content: " ";
    width: 34px;
    height: 34px;
    position: absolute;
    right: 4px;
    top: 6px
    }
.content-right .category-title {
    display: block;
    color: #32538b;
    text-transform: uppercase;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.4em
    }
.content-right .contact-us {
    display: block;
    position: relative;
    height: 80px;
    padding: 10px 0 0 70px;
    background: #bfbfbf;
    font-size: 1.1em;
    text-transform: uppercase;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer
    }
.content-right .contact-us p {
    font-size: 1.1em;
    color: #000
    }
.content-right .contact-us p:hover {
    color: #FFF !important
    }
.content-right .contact-us em {
    display: block;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-style: normal;
    font-size: 1.6em;
    padding-left: 30px
    }
.content-right .contact-us:before {
    content: " ";
    position: absolute;
    width: 27px;
    height: 35px;
    left: 19px;
    top: 22px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat 0 -205px
    }
.content-right .contact-us:hover:before {
    background-position: 0 -245px
    }
.content-right .newsletter {
    display: block;
    position: relative;
    height: 87px;
    padding: 10px 30px 0 88px;
    margin-top: 10px;
    background: #ffc114;
    font-size: 1.6em;
    text-transform: uppercase;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer
    }
.content-right .block .newsletter {
    text-align: center
    }
.simple-fix .content-right .newsletter {
    text-align: left
    }
.content-right .newsletter em {
    display: block;
    padding-left: 30px;
    font-style: normal
    }
.content-right .newsletter:before {
    content: " ";
    position: absolute;
    width: 35px;
    height: 24px;
    left: 22px;
    top: 31px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -59px -166px
    }
.content-right .newsletter:hover:before {
    background-position: -59px -193px
    }
.content-right .callback {
    position: relative;
    display: block;
    padding: 10px 0 10px 78px;
    margin-top: 10px;
    background: #4d4d4d;
    font-size: 1.6em;
    color: white;
    text-transform: uppercase;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer
    }
.content-right .callback:before {
    content: " ";
    position: absolute;
    width: 27px;
    height: 31px;
    left: 28px;
    top: 25%;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -106px -166px
    }
.content-right .custom {
    position: relative;
    display: block;
    padding: 10px 0 8px 78px;
    margin-top: 10px;
    font-size: 1.6em;
    color: white;
    text-transform: uppercase;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer
    }
.content-right .resa-ipad {
    position: relative;
    display: block;
    height: 60px;
    padding: 8px 0 0 78px;
    background: #32538b;
    font-size: 1.4em;
    line-height: 1.2em;
    color: white;
    text-transform: uppercase;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-family: "apercu_promedium", helvetica, sans-serif, arial
    }
.content-right .resa-ipad:before {
    content: " ";
    position: absolute;
    width: 35px;
    height: 30px;
    left: 22px;
    top: 17px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat 0 -88px
    }
.content-right .download-app {
    position: relative;
    display: block;
    height: 60px;
    padding: 8px 0 0 78px;
    margin-top: 10px;
    background: #ec7217;
    font-size: 1.4em;
    line-height: 1.2em;
    color: white;
    text-transform: uppercase;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-family: "apercu_promedium", helvetica, sans-serif, arial
    }
.content-right .download-app:before {
    content: " ";
    position: absolute;
    width: 44px;
    height: 32px;
    left: 17px;
    top: 17px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -143px -263px
    }
.content-right .contact-team {
    position: relative;
    display: block;
    height: 60px;
    padding: 8px 0 0 78px;
    margin-top: 10px;
    background: #666;
    font-size: 1.4em;
    line-height: 1.2em;
    color: white;
    text-transform: uppercase;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-family: "apercu_promedium", helvetica, sans-serif, arial
    }
.content-right .contact-team:before {
    content: " ";
    position: absolute;
    width: 32px;
    height: 34px;
    left: 28px;
    top: 17px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -106px -166px
    }
.content-right .callback:hover {
    background: black
    }
.content-right .contact-us:hover, .content-right .newsletter:hover, .content-right .resa-ipad:hover, .content-right .contact-team:hover, .content-right .download-app:hover, .content-right a:hover {
    background: black;
    color: white
    }
.content-right a.facebook, .content-right a.twitter, .content-right .social a {
    display: block;
    max-width: 230px;
    height: 40px;
    position: relative;
    padding: 7px 0 0 35px;
    margin-bottom: 8px;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.2em;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-transform: none;
    cursor: pointer;
    text-decoration: none;
    color: white
    }
.content-right .social .newsletter:before {
    content: "";
    background: none
    }
.content-right .social .newsletter:after {
    content: " ";
    position: absolute;
    width: 35px;
    height: 24px;
    right: 32px;
    top: 10px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -59px -193px
    }
.content-right .facebook {
    background: #32538b
    }
.content-right .facebook:after {
    content: " ";
    position: absolute;
    width: 20px;
    height: 24px;
    right: 36px;
    top: 9px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -41px -252px
    }
.content-right .twitter {
    background: #00a3ff
    }
.content-right .twitter:after {
    content: " ";
    position: absolute;
    width: 30px;
    height: 27px;
    right: 34px;
    top: 9px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -64px -252px
    }
.content-right .custom img {
    position: absolute;
    left: 22px;
    top: 35%
    }
#social-share-buttons {
    position: relative;
    top: -20px;
    height: 77px;
    padding-top: 35px;
    display: inline-block
    }
.share-facebook, .share-googleplus, .share-twitter {
    width: 50px;
    height: 40px
    }
.share-facebook:before, .share-googleplus:before, .share-twitter:before {
    content: " ";
    position: relative;
    display: block;
    width: 40px;
    height: 40px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat
    }
.share-facebook:before {
    background-position: -197px -295px
    }
.share-facebook:hover:before, .share-facebook.active:before {
    background-position: -512px 0
    }
.share-googleplus:before {
    background-position: -245px -295px
    }
.share-googleplus:hover:before, .share-googleplus.active:before {
    background-position: -512px -44px
    }
.share-twitter:before {
    background-position: -292px -295px
    }
.share-twitter:hover:before, .share-googleplus.active:before {
    background-position: -512px -88px
    }
.share-widget {
    /*display: none;*/
    opacity: 0;
    height: 0;
    overflow: hidden;
    position: absolute;
    height: 35px;
    line-height: 35px;
    background: #262626;
    padding: 0 5px 0 5px;
    color: white;
    /*min-width: 170px;*/
    }
.fb-like {
    bottom: 7px
    }
#google-widget, #twitter-widget {
    padding-top: 4px
    }
/* ----------------------------- */
/* == Planificateur              */
/* ----------------------------- */
.period-switcher {
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.2em
    }
.day-switcher {
    font-size: 1.8em
    }
.prev-day, .next-day {
    width: 42px;
    height: 42px;
    margin-top: 5px
    }
.prev-day:before, .next-day:before {
    content: " ";
    position: relative;
    margin: 0 auto 0 auto;
    display: block;
    width: 42px;
    height: 42px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat
    }
.prev-day:before {
    background-position: -55px -298px
    }
.next-day:before {
    background-position: -101px -298px
    }
.month-switcher {
    padding: 3px 20px 0 0;
    height: 40px;
    line-height: 40px
    }
.month-switcher strong {
    padding: 0 10px 0 0;
    color: #333;
    line-height: 40px
    }
.month-switcher .date-container {
    background: #ec7217;
    color: white;
    display: inline-block;
    width: 215px;
    text-transform: capitalize
    }
.month-switcher .date-container:after {
    content: " ";
    position: absolute;
    top: 5px;
    right: 5px;
    display: block;
    width: 42px;
    height: 31px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -149px -302px
    }
.month-switcher .date-container span.date {
    background: none
    }
.js-list-select {
    margin-top: 0;
    padding: 0;
    background-color: #fff;
    font-family: "apercu_prolight", helvetica, sans-serif, arial;
    font-size: 0.9em;
    font-weight: normal;
    border: 1px solid #ccc;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-box-shadow: 0 0 15px #666;
    -webkit-box-shadow: 0 0 15px #666
    }
.js-list-select li {
    list-style: none
    }
.js-list-select a {
    color: #666;
    display: block;
    padding: 5px 10px 5px 10px;
    text-align: center
    }
.js-list-select li a:hover {
    background-color: #ddd
    }
.planif-events li {
    padding: 30px 20px 25px 25px;
    font-size: 1.1em;
    text-transform: uppercase
    }
.planif-events li:nth-child(odd) {
    background: #ededed
    }
.planif-events li:nth-child(even) {
    background: white
    }
.planif-events .time {
    display: block;
    color: #666;
    font-family: "apercu_promedium", helvetica, sans-serif, arial
    }
.planif-events .time-from:after {
    content: " ";
    position: relative;
    left: 12px;
    top: 4px;
    display: block;
    margin-bottom: 8px;
    width: 20px;
    height: 14px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -19px -321px
    }
.planif-events .title {
    width: 28%;
    position: relative;
    padding: 0 10px 0 20px
    }
.planif-events .title h2 {
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    line-height: 1.2em;
    font-size: 1.5em;
    margin: 0
    }
.planif-events .details {
    width: 27%;
    position: relative;
    padding-left: 20px
    }
.planif-events .actions {
    width: 38%;
    padding-left: 20px;
    padding-top: 15px
    }
.planif-events .details span {
    display: block
    }
.planif-events .details strong {
    font-family: "apercu_promedium", helvetica, sans-serif, arial
    }
.planif-events .details:before, .planif-events .title:before {
    content: " ";
    display: block;
    width: 1px;
    height: 94%;
    background: #000;
    position: absolute;
    top: 4px;
    left: 0
    }
/* ----------------------------- */
/* == Footer                     */
/* ----------------------------- */
.footer {
    background: #a8a8a8;
    text-align: center;
    padding: 0 0 35px 0
    }
.top-links {
    padding-top: 35px
    }
.top-links a {
    display: inline-block;
    position: relative;
    height: 30px;
    line-height: 30px;
    padding: 0 30px 0 30px;
    margin-right: 7px;
    background: #FFF;
    color: #666;
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.2em;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-transform: uppercase;
    -webkit-transition: all 250ms ease;
    -moz-transition: all 250ms ease;
    -ms-transition: all 250ms ease;
    -o-transition: all 250ms ease;
    transition: all 250ms ease
    }
.top-links a:before {
    content: " ";
    width: 10px;
    height: 13px;
    position: absolute;
    left: 13px;
    top: 10px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat 0 -15px
    }
.top-links a:hover {
    background: #000;
    color: white
    }
.top-links a:hover:before {
    background-position: 0 0
    }
.top-links a:last-child {
    margin-right: 0
    }
.middle-links {
    margin: 35px auto 35px auto;
    height: 36px
    }
.middle-links a {
    display: inline-block;
    margin-right: 18px
    }
.middle-links .facebook {
    width: 30px
    }
.middle-links .facebook:before {
    content: " ";
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -41px -222px;
    width: 14px;
    height: 26px;
    display: block;
    margin: 0 auto 0 auto
    }
.middle-links .facebook:hover:before {
    background-position: -41px -252px
    }
.middle-links .twitter {
    width: 38px
    }
.middle-links .twitter:before {
    content: " ";
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -64px -222px;
    width: 31px;
    height: 27px;
    display: block;
    margin: 0 auto 0 auto
    }
.middle-links .twitter:hover:before {
    background-position: -64px -252px
    }
.middle-links .youtube {
    width: 35px
    }
.middle-links .youtube:before {
    content: " ";
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -106px -203px;
    width: 28px;
    height: 34px;
    display: block;
    margin: 0 auto 0 auto
    }
.middle-links .youtube:hover:before {
    background-position: -106px -240px
    }
.middle-links .tripadvisor {
    width: 44px
    }
.middle-links .tripadvisor:before {
    content: " ";
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -145px -203px;
    width: 39px;
    height: 25px;
    display: block;
    position: relative;
    top: -3px;
    margin: 0 auto 0 auto
    }
.middle-links .tripadvisor:hover:before {
    background-position: -145px -230px
    }
.middle-links .download-app:before {
    content: " ";
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -226px -210px;
    width: 145px;
    height: 35px;
    display: block;
    position: relative;
    top: 3px;
    margin: 0 auto 0 auto
    }
.middle-links .download-app:hover:before {
    background-position: -213px -249px
    }
.middle-links a:last-child {
    margin-right: 0
    }
.bottom-links a {
    position: relative;
    font-family: "apercu_prolight", helvetica, sans-serif, arial;
    font-weight: bold;
    font-size: 1.1em;
    color: #333;
    padding-right: 25px;
    -webkit-transition: all 250ms ease;
    -moz-transition: all 250ms ease;
    -ms-transition: all 250ms ease;
    -o-transition: all 250ms ease;
    transition: all 250ms ease
    }
.bottom-links a:hover {
    color: white
    }
.bottom-links a:after {
    content: " ";
    border-left: 2px #333 solid;
    height: 0.8em;
    position: absolute;
    right: 10px;
    top: 6px
    }
.bottom-links a:last-child:after {
    border: none
    }
.bottom-links a:last-child {
    padding-right: 0
    }
/* ----------------------------- */
/* == Formulaires                */
/* ----------------------------- */
form * {
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.03em;
    font-style: normal
    }
fieldset {
    padding: 0
    }
::-webkit-input-placeholder {
    color: #333
    }
input:-moz-placeholder, textarea:-moz-placeholder {
    color: #333
    }
.date-container, .heure-container {
    position: relative;
    display: block;
    background: #c5c5c5;
    padding: 2px 54px 2px 2px;
    height: 40px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    cursor: pointer;
    outline: none
    }
.date-container:after, .heure-container:after {
    content: " ";
    position: absolute;
    top: 6px;
    right: 5px;
    width: 41px;
    height: 30px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat 0 -165px
    }
.heure-container:after {
    background-position: -430px -298px
    }
span.date {
    display: block;
    width: 100%;
    height: 36px;
    line-height: 36px;
    border: none;
    background: white;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding-left: 9px
    }
.container-time {
    position: relative;
    z-index: 2000;
    outline: none
    }
.select-heure {
    display: block;
    width: 100%;
    height: 36px;
    line-height: 36px;
    font-size: 0.95em;
    padding-left: 9px;
    background: white;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #333
    }
.select-heure:hover {
    color: inherit
    }
.container-time .js-list-select {
    width: 480px;
    padding: 5px 5px 5px 5px;
    font-size: 0.8em;
    margin-top: 2px;
    color: #333
    }
.container-time .js-list-select li:first-child {
    display: none
    }
.container-time .js-list-select li {
    display: inline-block;
    height: 30px;
    width: 25%
    }
.container-time .js-list-select li.optgroup {
    display: block;
    width: 96%;
    height: 26px;
    margin: 5px 10px 5px 10px;
    border-bottom: 1px solid #ddd
    }
.container-time .js-list-select li.optgroup span {
    color: #00a3ff;
    font-family: "apercu_prolight", helvetica, sans-serif, arial
    }
.container-time .js-list-select li a {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    font-family: "apercu_prolight", helvetica, sans-serif, arial
    }
.numeric-container {
    position: relative;
    display: block;
    background: #c5c5c5;
    padding: 2px 0 2px 12px;
    height: 40px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
    }
.numeric-container em {
    position: relative;
    top: 2px;
    padding-right: 26px;
    line-height: 33px
    }
.select-container-numeric {
    position: absolute;
    width: 50px;
    height: 36px;
    right: 2px;
    top: 2px;
    outline: none;
    z-index: 1000;
    background: white;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
    }
.select-numeric {
    display: block;
    width: 50px;
    height: 38px;
    line-height: 38px;
    padding-left: 10px;
    color: #333
    }
.select-numeric:after {
    content: " ";
    position: absolute;
    top: 16px;
    right: 5px;
    width: 10px;
    height: 10px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -29px -178px
    }
.date.error, .field-border.error, .heure-container.error .select-heure, .numeric-container.error .select-container-numeric, input.error, select.error {
    border: 2px red solid !important
    }
.checkbox-like {
    display: block;
    cursor: pointer;
    position: relative;
    margin-right: 15px
    }
.checkbox-like-label {
    cursor: pointer
    }
.checkbox-like:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 22px;
    height: 22px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -378px -298px
    }
.checkbox-like.unchecked:before {
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -404px -298px
    }
/*
.numeric-container select{
	position: absolute;
	right: 1px;
}*/
input[type=text] {
    width: 100%;
    height: 36px;
    border: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding-left: 9px;
    color: #333
    }
input[type=email] {
    width: 100%;
    height: 36px;
    border: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding-left: 9px;
    color: #333
    }
select {
    height: 36px;
    border: 1px white solid;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #333
    }
textarea {
    margin: 0;
    width: 100%;
    padding: 10px 5px 5px 12px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: none;
    color: #333
    }
.field-border {
    border: 2px #c5c5c5 solid !important;
    height: 40px !important
    }
form#reserver-table, form.contact {
    background: #ededed;
    padding: 20px 10px 17px 20px
    }
/* ----------------------------- */
/* == Overlays                   */
/* ----------------------------- */
.overlay {
    position: absolute;
    display: none
    }
.overlay-form {
    display: none;
    position: relative;
    width: 375px;
    margin: 0 auto 0 auto;
    padding: 30px;
    background: #ededed;
    -moz-box-shadow: -3px 4px 20px 1px #656565;
    -webkit-box-shadow: -3px 4px 20px 1px #656565;
    -o-box-shadow: -3px 4px 20px 1px #656565;
    box-shadow: -3px 4px 20px 1px #656565;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px
    }
.overlay-closer {
    width: 16px;
    height: 16px !important;
    position: absolute !important;
    right: 8px;
    top: 6px;
    cursor: pointer !important
    }
.overlay-closer:after {
    content: " ";
    position: absolute;
    top: 6px;
    right: 5px;
    width: 16px;
    height: 16px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -31px -284px
    }
.overlay-title {
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    font-size: 1.7em;
    text-transform: uppercase;
    display: block
    }
#newsletter .overlay-title {
    padding-left: 46px;
    position: relative
    }
#newsletter .overlay-title:before {
    content: " ";
    position: absolute;
    width: 35px;
    height: 24px;
    left: 0;
    top: 6px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -59px -166px
    }
#newsletter select {
    width: 100%
    }
#call-me-back .overlay-title {
    padding-left: 44px;
    position: relative
    }
#call-me-back .overlay-title:before {
    content: " ";
    position: absolute;
    width: 27px;
    height: 32px;
    left: 0;
    top: 3px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -139px -166px
    }
#error-message {
    color: red !important;
    padding-bottom: 10px;
    margin-left: 5px;
    display: none
    }
#error-message span, #error-message ul li {
    font-size: 0.9em !important
    }
/* ----------------------------- */
/* == Video player               */
/* ----------------------------- */
.overlay-video, .overlay-video-ext {
    width: 960px;
    height: 540px
    }
/* ----------------------------- */
/* == SiteMap                    */
/* ----------------------------- */
.sitemap .line {
    margin-top: 10px
    }
.sitemap .line h3 {
    margin: 0;
    margin-top: 5px !important;
    margin-bottom: 10px
    }
.sitemap .line h4 {
    margin-left: 50px !important;
    margin-top: 5px !important;
    margin: 0;
    margin-bottom: 10px;
    font-size: 1.7rem
    }
.sitemap .line h5 {
    margin-left: 100px !important;
    margin-bottom: 7px !important;
    margin: 0;
    font-size: 1.4rem
    }
.sitemap hr {
    margin: 0
    }
.sitemap .left-part {
    float: left;
    width: 50%;
    margin-bottom: 30px
    }
.sitemap .right-part {
    float: left;
    width: 50%;
    margin-top: 56px;
    margin-bottom: 30px
    }
.sitemap a {
    color: black
    }
.sitemap a:hover {
    color: #32538b
    }
/* ----------------------------- */
/* == Utils                      */
/* ----------------------------- */
.hidden {
    display: none
    }
.bkg-dark {
    background-color: #262626
    }
.link-grey, .link-grey a {
    color: #a8a8a8
    }
.bkg-white {
    background: white
    }
.highlighted {
    color: #ec7217 !important
    }
.white {
    color: white !important
    }
.small-italic {
    font-size: 0.9em;
    font-style: italic;
    font-family: "apercu_prolight", helvetica, sans-serif, arial
    }
.w05 {
    width: 5%
    }
.w12 {
    width: 12%
    }
.w15 {
    width: 15%
    }
.w17 {
    width: 17%
    }
.w35 {
    width: 35%
    }
.w100 {
    width: 100%
    }
.pl1 {
    padding-left: 10px
    }
.pr1 {
    padding-right: 10px
    }
.pr2 {
    padding-right: 20px
    }
.ptxm {
    padding-top: 1.5em
    }
.ml1 {
    margin-left: 10px
    }
.mr1 {
    margin-right: 10px
    }
.mr15 {
    margin-right: 15px
    }
.mr2 {
    margin-right: 20px
    }
.mt0 {
    margin-top: 0 !important
    }
.mt1 {
    margin-top: 10px
    }
.mt2 {
    margin-top: 20px
    }
.mt3 {
    margin-top: 30px
    }
.mb07 {
    margin-bottom: 7px
    }
.mb1 {
    margin-bottom: 10px
    }
.mbxs {
    margin-bottom: 10px
    }
.mb22 {
    margin-bottom: 22px
    }
.mw300 {
    max-width: 300px
    }
.mw270 {
    max-width: 270px
    }
.mw220 {
    max-width: 220px
    }
.mw200 {
    max-width: 200px
    }
.mw180 {
    max-width: 180px
    }
.mw160 {
    max-width: 160px !important
    }
.mw100 {
    max-width: 100px !important
    }
.maj {
    text-transform: uppercase
    }
.min {
    text-transform: none !important
    }
.valign-middle {
    vertical-align: middle
    }
.underlined {
    text-decoration: underline !important
    }
.buttons-fix p {
    line-height: 23px;
    color: white;
    font-size: 0.9em
    }
.buttons-fix .eztext-field {
    font-family: "apercu_promedium", helvetica, sans-serif, arial;
    line-height: 23px;
    color: white;
    font-size: 0.8em
    }
form.sqliezform p {
    line-height: 1.5;
    color: #666;
    font-size: 1.1em
    }
.overlay-closer.close {
    background-color: transparent !important
    }
.autogrid5.fix > * {
    width: 19%
    }
.ezxmltext-field h4 {
    margin-bottom: 0
    }
.ezxmltext-field p {
    margin-top: 0
    }
form input, span.date, a.select-heure, form em, form textarea {
    font-family: "apercu_prolight", helvetica, sans-serif, arial
    }
a.custom {
    font-family: "apercu_promedium", helvetica, sans-serif, arial
    }
a.custom:hover {
    background-color: black !important
    }
a.custom.fix-picto img {
    top: 20% !important
    }
.object-left {
    float: left;
    margin-right: 5px
    }
.object-right {
    float: right;
    margin-left: 5px
    }
#info-description p {
    font-family: "apercu_prolight", helvetica, sans-serif, arial;
    color: black;
    font-weight: bold
    }
.details-evenement .row {
    margin-bottom: 10px
    }
.details-evenement .row a {
    display: inline-block
    }
.resa-ipad .ezxmltext-field {
    height: 100%;
    display: table;
    padding-bottom: 8px
    }
.resa-ipad .ezxmltext-field p {
    display: table-cell;
    vertical-align: middle
    }
.ezxmltext-field table, .ezxmltext-field td, .ezxmltext-field tr, .ezxmltext-field th {
    border: none !important
    }
.object-center img {
    display: block;
    margin: 0 auto
    }
.ui-dialog-titlebar {
    display: none
    }
#dialog iframe {
    margin-left: auto;
    margin-right: auto;
    display: block
    }
.message-right .push-desc {
    display: inline-block;
    color: #FFF;
    text-transform: uppercase;
    font-size: 0.95em
    }
.message-right .push-desc:hover {
    color: #32538b
    }
/*@media (max-width: 768px)  {
.univers-launcher.autogrid5 > * {
		width: 19%;
	}
}*/
@media (max-width: 1024px) {
    /* ---------------------------------- */
    /* == MENU TOP                        */
    /* ---------------------------------- */
    .header-top {
        font-size: 0.85em
        }
    /* ---------------------------------- */
    /* == MENU SLIDER                     */
    /* ---------------------------------- */
    .header-menu-slider {
        font-size: 0.75em;
        height: 175px !important;
        max-height: 175px !important
        }
    .header-menu-slider li {
        height: 175px !important
        }
    .header-menu-slider li:first-child {
        width: 17%
        }
    .header-menu-slider a.picto-link, .header-menu-slider a.link-txt-bl {
        margin-bottom: 35px
        }
    .header-menu-slider a:last-child {
        margin-bottom: 0
        }
    .header-menu-slider ul.pl1 {
        padding-left: 3px
        }
    .header-menu-slider .picto-link {
        padding-left: 32px
        }
    .header-menu-slider .agenda:before {
        width: 21px;
        height: 27px;
        top: 2px;
        left: 2px;
        background-position: -59px -93px
        }
    .header-menu-slider .agenda:hover:before {
        background-position: -59px -131px
        }
    .header-menu-slider .infos-pratiques:before {
        width: 26px;
        height: 26px;
        top: 2px;
        left: 0;
        background-position: -106px -93px
        }
    .header-menu-slider .infos-pratiques:hover:before {
        background-position: -106px -131px
        }
    .header-menu-slider .billet:before {
        width: 23px;
        height: 23px;
        top: 4px;
        left: 2px;
        background-position: -201px -94px
        }
    .header-menu-slider .billet:hover:before {
        background-position: -201px -132px
        }
    .header-menu-slider .offrir:before {
        width: 21px;
        height: 26px;
        top: 2px;
        left: 5px;
        background-position: -159px -92px
        }
    .header-menu-slider .offrir:hover:before {
        background-position: -159px -129px
        }
    .header-menu-slider .txt-link {
        padding-left: 5px
        }
    .header-menu-slider .txt-link:before {
        height: 32px
        }
    .message-right .link-article:after {
        background-position: -28px -35px;
        top: -2px
        }
    .message-right .link-article:hover:after {
        background-position: -28px -60px
        }
    .message-left .horaires {
        margin-top: 25px
        }
    /* ---------------------------------- */
    /* == Cartouche top                   */
    /* ---------------------------------- */
    .cartouche-top {
        font-size: 0.8em;
        padding-bottom: 15px
        }
    .h1-img {
        max-width: 60%
        }
    /* ---------------------------------- */
    /* == Médias slider                   */
    /* ---------------------------------- */
    .medias-show {
        font-size: 0.8em
        }
    .medias-show .infos-left .title, .medias-show .infos-right .title {
        top: 45px
        }
    .medias-show .play-video:before {
        background-position: -427px -121px;
        width: 79px;
        height: 79px
        }
    .medias-show .play-video:hover:before {
        background-position: -427px -205px
        }
    .video-thumbs .play-video:before {
        background-position: -259px -108px;
        width: 48px;
        height: 48px;
        top: 25%
        }
    .video-thumbs a:hover .play-video:before {
        background-position: -259px -160px
        }
    .video-thumbs .lien-interne:before {
        background-position: -525px -254px;
        width: 48px;
        height: 48px;
        top: 25%
        }
    .video-thumbs a:hover .lien-interne:before {
        background-position: -525px -304px
        }
    .video-thumbs h6 {
        height: 35px;
        font-size: 0.8em
        }
    .navi {
        left: 50%
        }
    /* ---------------------------------- */
    /* == Liens                           */
    /* ---------------------------------- */
    .link-blue-arrowtoright {
        padding: 12px 42px 10px 18px
        }
    .link-blue-arrowtoright:after {
        background-position: 0 -35px;
        width: 23px;
        height: 23px;
        top: 9px
        }
    .link-blue-arrowtoright:hover {
        background: white;
        color: #32538b
        }
    .link-blue-arrowtoright:hover:after {
        background-position: 0 -59px
        }
    .link-txt-bl {
        padding-left: 10px
        }
    .link-txt-bl:before {
        height: 30px;
        top: 1px
        }
    .fix-shitty-css.butt-classic, .fix-shitty-css.butt-icon {
        font-size: 2.2em
        }
    h3.fix-shitty-css {
        font-size: 2.6em !important
        }
    h4.fix-shitty-css {
        font-size: 1.2em !important
        }
    h3.fix-shitty-css span, h4.fix-shitty-css span {
        width: 470px !important
        }
    /* ---------------------------------- */
    /* == UNIVERS                         */
    /* ---------------------------------- */
    .univers-launcher.autogrid5 > * {
        width: 19%
        }
    /* ---------------------------------- */
    /* == Formulaires                     */
    /* ---------------------------------- */
    form#reserver-table * {
        font-size: 1em
        }
    input[type=text], .numeric-container, span.date, .select-heure {
        padding-left: 5px
        }
    .select-container-numeric {
        width: 40px
        }
    #form-reservation-hotel .pr2, #reserver-table .pr2 {
        padding-right: 12px
        }
    .date-container {
        min-width: 158px
        }
    /* ---------------------------------- */
    /* == Page content                    */
    /* ---------------------------------- */
    .content-left {
        padding-right: 40px
        }
    .content-right {
        width: 275px;
        font-size: 0.9em
        }
    .details-evenement .col {
        display: inline-block;
        width: 50%
        }
    .details-evenement div.col:last-child {
        display: block;
        width: 100%
        }
    .details-evenement div.col:last-child a {
        position: relative;
        left: 50%
        }
    .planif-events li {
        font-size: 1.1em
        }
    .planif-events .time {
        width: 9%
        }
    .planif-events .title {
        width: 33%
        }
    .planif-events .details {
        width: 33%
        }
    .planif-events .actions {
        width: 25%;
        padding-top: 0
        }
    .planif-events .actions a {
        margin: 0 0 5px 0
        }
    .content-right .contact-team {
        padding-top: 10px;
        font-size: 1.3em
        }
    h4.ffu {
        top: 60% !important
        }
    }
/* For the details, see:
   http://flowplayer.org/tools/dateinput/index.html#skinning */
/* the input field */
/*
.date {
    border:1px solid #ccc;
    padding:4px;
    width:194px;
    -moz-box-shadow:0 0 10px #eee inset;
    -webkit-box-shadow:0 0 10px #eee inset;
}
*/
/* calendar root element */
#calroot {
    /* place on top of other elements. set a higher value if nessessary */
    z-index: 10000;
    margin-top: 2px;
    width: 289px;
    padding: 5px 5px 5px 7px;
    background-color: #fff;
    font-size: 1em;
    border: 1px solid #ccc;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0 0 15px #666;
    -webkit-box-shadow: 0 0 15px #666;
    box-shadow: 0 0 15px #666;
    font-family: "apercu_prolight", helvetica, sans-serif, arial;
    position: absolute;
    top: 0
    }
/* head. contains title, prev/next month controls and possible month/year selectors */
#calhead {
    padding: 2px 0;
    height: 27px
    }
#caltitle {
    font-size: 14px;
    color: #00a3ff;
    float: left;
    text-align: center;
    width: 235px;
    line-height: 22px
    }
#calnext, #calprev {
    display: block;
    width: 20px;
    height: 20px;
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -35px -83px;
    float: left;
    cursor: pointer;
    position: relative;
    top: 1px
    }
#calprev {
    left: 6px
    }
#calnext {
    background: url(../bundles/sqlifontevraud/desktop/img/sprite.png) no-repeat -28px -60px;
    float: right;
    right: 6px
    }
#calprev.caldisabled, #calnext.caldisabled {
    visibility: hidden
    }
/* year/month selector */
#caltitle select {
    font-size: 10px
    }
/* names of the days */
#caldays {
    height: 20px;
    border-bottom: 1px solid #ddd
    }
#caldays span {
    display: block;
    float: left;
    width: 39px;
    text-align: center
    }
/* container for weeks */
#calweeks {
    background-color: #fff;
    margin-top: 4px
    }
/* single week */
.calweek {
    clear: left;
    height: 22px
    }
/* single day */
.calweek a {
    display: block;
    float: left;
    width: 38px;
    height: 36px;
    text-decoration: none;
    font-size: 1em;
    margin-left: 1px;
    text-align: center;
    line-height: 36px;
    color: #666;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px
    }
/* different states */
.calweek a:hover, .calfocus {
    background-color: #ddd
    }
/* sunday */
a.calsun {
    color: red
    }
/* offmonth day */
a.caloff {
    color: #ccc
    }
a.caloff:hover {
    background-color: rgb(245, 245, 250)
    }
/* unselecteble day */
a.caldisabled {
    background-color: #efefef !important;
    color: #ccc !important;
    cursor: default
    }
/* current day */
#calcurrent {
    background-color: #498CE2;
    color: #fff
    }
/* today */
#caltoday {
    background-color: #333;
    color: #fff
    }
/*
	* Style settings of LayerSlider
	*
	* (c) 2011-2013 George Krupa, John Gera & Kreatura Media
	*
	* Plugin web:			http://kreaturamedia.com/
	* Licenses: 			http://codecanyon.net/licenses/
*/
/* Global settings */
.ls-container {
    visibility: hidden;
    position: relative
    }
.ls-lt-container {
    position: absolute
    }
.ls-lt-container, .ls-lt-container * {
    text-align: left !important;
    direction: ltr !important
    }
.ls-container-fullscreen {
    margin: 0 auto !important;
    padding: 2% !important;
    background: black !important;
    border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
    border: none !important
    }
.ls-container-fullscreen .ls-thumbnail-wrapper, .ls-container-fullscreen .ls-fullscreen, .ls-container-fullscreen .ls-shadow {
    display: none !important
    }
.ls-overflow-hidden {
    overflow: hidden
    }
.ls-inner {
    position: relative;
    background-position: center center;
    z-index: 2
    }
.ls-loading-container {
    position: absolute !important;
    display: none;
    z-index: 3 !important;
    left: 50% !important;
    top: 50% !important
    }
.ls-loading-indicator {
    margin: 0 auto
    }
.ls-inner, .ls-slide {
    width: 100%;
    height: 100%
    }
.ls-slide, .ls-layer {
    position: absolute;
    display: none;
    background-position: center center;
    overflow: hidden
    }
.ls-active, .ls-animating {
    display: block !important
    }
.ls-slide > * {
    position: absolute;
    line-height: normal;
    margin: 0;
    left: 0;
    top: 0
    }
.ls-slide .ls-bg {
    left: 0;
    top: 0;
    transform: none !important;
    -o-transform: none !important;
    -ms-transform: none !important;
    -moz-transform: none !important;
    -webkit-transform: none !important
    }
.ls-yourlogo {
    position: absolute;
    z-index: 99
    }
/* Timers */
.ls-bar-timer {
    position: absolute;
    width: 0;
    height: 2px;
    background: white;
    border-bottom: 2px solid #555;
    opacity: 0.55;
    filter: alpha(opacity=55);
    z-index: 4;
    top: 0
    }
.ls-circle-timer {
    width: 16px;
    height: 16px;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 4;
    opacity: 0.65;
    filter: alpha(opacity=65);
    display: none
    }
.ls-ct-half {
    background: white
    }
.ls-ct-center {
    background: #444
    }
.ls-ct-left, .ls-ct-right {
    width: 50%;
    height: 100%;
    overflow: hidden
    }
.ls-ct-left, .ls-ct-right {
    float: left;
    position: relative
    }
.ls-ct-rotate {
    width: 200%;
    height: 100%;
    position: absolute;
    top: 0
    }
.ls-ct-left .ls-ct-rotate, .ls-ct-right .ls-ct-hider, .ls-ct-right .ls-ct-half {
    left: 0
    }
.ls-ct-right .ls-ct-rotate, .ls-ct-left .ls-ct-hider, .ls-ct-left .ls-ct-half {
    right: 0
    }
.ls-ct-hider, .ls-ct-half {
    position: absolute;
    top: 0
    }
.ls-ct-hider {
    width: 50%;
    height: 100%;
    overflow: hidden
    }
.ls-ct-half {
    width: 200%;
    height: 100%
    }
.ls-ct-center {
    width: 50%;
    height: 50%;
    left: 25%;
    top: 25%;
    position: absolute
    }
.ls-ct-half, .ls-ct-center {
    border-radius: 100px;
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px
    }
/* Navigation */
.ls-bottom-nav-wrapper {
    height: 0
    }
.ls-bottom-slidebuttons {
    text-align: left
    }
.ls-bottom-nav-wrapper, .ls-below-thumbnails {
    z-index: 2;
    height: 0;
    position: relative;
    text-align: center;
    margin: 0 auto
    }
.ls-below-thumbnails {
    display: none;
    z-index: 6
    }
.ls-bottom-nav-wrapper a, .ls-nav-prev, .ls-nav-next {
    outline: none
    }
* .ls-bottom-nav-wrapper *, * .ls-bottom-nav-wrapper span * {
    direction: ltr !important
    }
.ls-bottom-slidebuttons {
    position: relative;
    z-index: 1000
    }
.ls-bottom-slidebuttons, .ls-nav-start, .ls-nav-stop, .ls-nav-sides {
    position: relative
    }
.ls-nothumb {
    text-align: center !important
    }
.ls-link {
    position: absolute;
    width: 100% !important;
    height: 100% !important;
    left: 0 !important;
    top: 0 !important;
    background-image: url(../bundles/sqlifontevraud/desktop/css/layerslider/css/blank.gif)
    }
.ls-slide > a > * {
    background-image: url(../bundles/sqlifontevraud/desktop/css/layerslider/css/blank.gif)
    }
/* Embedded videos */
.ls-vpcontainer {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0
    }
.ls-videopreview {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer
    }
.ls-playvideo {
    position: absolute;
    left: 50%;
    top: 50%;
    cursor: pointer
    }
/* Thumbnails */
.ls-tn {
    display: none !important
    }
.ls-thumbnail-hover {
    display: none;
    position: absolute;
    left: 0
    }
.ls-thumbnail-hover-inner {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    display: none
    }
.ls-thumbnail-hover-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
    }
.ls-thumbnail-hover-img {
    position: absolute;
    overflow: hidden
    }
.ls-thumbnail-hover img {
    max-width: none !important;
    position: absolute;
    display: inline-block;
    visibility: visible !important;
    left: 50%;
    top: 0
    }
.ls-thumbnail-hover span {
    left: 50%;
    top: 100%;
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
    border-bottom-color: transparent !important
    }
.ls-thumbnail-wrapper {
    position: relative;
    width: 100%;
    margin: 0 auto;
    z-index: 4
    }
.ls-thumbnail {
    position: relative;
    margin: 0 auto
    }
.ls-thumbnail-inner, .ls-thumbnail-slide-container {
    width: 100%
    }
.ls-thumbnail-slide-container {
    overflow: hidden !important;
    position: relative
    }
.ls-touchscroll {
    overflow-x: auto !important
    }
.ls-thumbnail-slide {
    text-align: center;
    white-space: nowrap;
    float: left;
    position: relative
    }
.ls-thumbnail-slide a {
    overflow: hidden;
    display: inline-block;
    width: 0;
    height: 0;
    position: relative
    }
.ls-thumbnail-slide img {
    max-width: none !important;
    max-height: 100% !important;
    height: 100%;
    visibility: visible !important
    }
.ls-shadow {
    display: none;
    position: absolute;
    z-index: 1;
    top: 100%;
    width: 100%;
    left: 0;
    overflow: hidden !important;
    visibility: hidden
    }
.ls-shadow img {
    width: 100% !important;
    height: auto !important;
    position: absolute !important;
    left: 0 !important;
    bottom: 0 !important
    }
.ls-bottom-nav-wrapper, .ls-thumbnail-wrapper, .ls-nav-prev, .ls-nav-next {
    visibility: hidden
    }
/* WP plugin fullwidth */
.ls-wp-fullwidth-container {
    width: 100%;
    position: relative
    }
.ls-wp-fullwidth-helper {
    position: absolute
    }
/* 2D & 3D Layer Transitions */
.ls-overflow-hidden {
    overflow: hidden
    }
.ls-lt-tile {
    position: relative;
    float: left;
    perspective: 1000px;
    -o-perspective: 1000px;
    -ms-perspective: 1000px;
    -moz-perspective: 1000px;
    -webkit-perspective: 1000px
    }
.ls-lt-tile img {
    visibility: visible;
    display: inline-block
    }
.ls-curtiles {
    overflow: hidden
    }
.ls-curtiles, .ls-nexttiles {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0
    }
.ls-curtile, .ls-nexttile {
    overflow: hidden;
    position: absolute;
    width: 100% !important;
    height: 100% !important;
    backface-visibility: hidden;
    -o-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -webkit-backface-visibility: hidden
    }
.ls-curtile {
    left: 0;
    top: 0
    }
.ls-curtile img, .ls-nexttile img {
    position: absolute;
    filter: inherit
    }
.ls-3d-container {
    position: relative;
    overflow: visible !important
    }
.ls-3d-box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d
    }
.ls-3d-box div {
    overflow: hidden;
    background: #777;
    margin: 0;
    padding: 0;
    position: absolute
    }
/* Full screen */
.ls-fullscreen {
    position: absolute;
    z-index: 10;
    cursor: pointer;
    display: block
    }
/* Removing all default global styles of WordPress themes */
html * .ls-nav-prev, html * .ls-nav-next, html * .ls-container img, html * .ls-bottom-nav-wrapper a, html * .ls-container .ls-fullscreen, body * .ls-nav-prev, body * .ls-nav-next, body * .ls-container img, body * .ls-bottom-nav-wrapper a, body * .ls-container .ls-fullscreen, #ls-global * .ls-nav-prev, #ls-global * .ls-nav-next, #ls-global * .ls-container img, #ls-global * .ls-bottom-nav-wrapper a, #ls-global * .ls-container .ls-fullscreen, html * .ls-thumbnail a, body * .ls-thumbnail a, #ls-global * .ls-thumbnail a {
    transition: none;
    -o-transition: none;
    -ms-transition: none;
    -moz-transition: none;
    -webkit-transition: none;
    line-height: normal;
    outline: none;
    padding: 0;
    border: 0
    }
html * .ls-slide > a, body * .ls-slide > a, #ls-global * .ls-slide > a, html * .ls-slide > h1, body * .ls-slide > h1, #ls-global * .ls-slide > h1, html * .ls-slide > h2, body * .ls-slide > h2, #ls-global * .ls-slide > h2, html * .ls-slide > h3, body * .ls-slide > h3, #ls-global * .ls-slide > h3, html * .ls-slide > h4, body * .ls-slide > h4, #ls-global * .ls-slide > h4, html * .ls-slide > h5, body * .ls-slide > h5, #ls-global * .ls-slide > h5, html * .ls-slide > p, body * .ls-slide > p, #ls-global * .ls-slide > p, html * .ls-slide > div, body * .ls-slide > div, #ls-global * .ls-slide > div, html * .ls-slide > span, body * .ls-slide > span, #ls-global * .ls-slide > span, html * .ls-slide > *, body * .ls-slide > *, #ls-global * .ls-slide > * {
    transition: none;
    -o-transition: none;
    -ms-transition: none;
    -moz-transition: none;
    -webkit-transition: none
    }
html * .ls-slide > *, body * .ls-slide > *, #ls-global * .ls-slide > * {
    margin: 0
    }
html * .ls-container img, body * .ls-container img, #ls-global * .ls-container img {
    background: none !important;
    min-width: 0 !important;
    max-width: none !important;
    border-radius: 0;
    box-shadow: none;
    border: 0;
    padding: 0
    }
/*html * .ls-thumbnail a img,
body * .ls-thumbnail a img,
#ls-global * .ls-thumbnail a img {
	min-width: 100% !important;
}
*/
html * .ls-wp-container .ls-slide > *, body * .ls-wp-container .ls-slide > *, #ls-global * .ls-wp-container .ls-slide > * {
    line-height: normal;
    outline: none;
    padding: 0;
    margin: 0;
    border: 0
    }
html * .ls-wp-container .ls-slide > a > *, body * .ls-wp-container .ls-slide > a > *, #ls-global * .ls-wp-container .ls-slide > a > * {
    margin: 0
    }
html * .ls-wp-container .ls-slide > a, body * .ls-wp-container .ls-slide > a, #ls-global * .ls-wp-container .ls-slide > a {
    text-decoration: none
    }
.ls-wp-fullwidth-container, .ls-wp-fullwidth-helper, .ls-container, .ls-container * {
    box-sizing: content-box !important;
    -moz-box-sizing: content-box !important;
    -webkit-box-sizing: content-box !important
    }
html * .ls-yourlogo, body * .ls-yourlogo, #ls-global * .ls-yourlogo {
    margin: 0
    }
html * .ls-tn, body * .ls-tn, #ls-global * .ls-tn {
    display: none
    }
.site {
    overflow: visible !important
    }
/* Style of LayerSlider Debug Console */
.ls-debug-console * {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    color: white !important;
    text-shadow: none !important;
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Arial, sans-serif !important;
    line-height: normal !important;
    -webkit-font-smoothing: antialiased !important;
    text-align: left !important;
    font-style: normal !important
    }
.ls-debug-console h1 {
    padding-top: 10px !important;
    font-size: 17px !important;
    font-weight: bold !important
    }
.ls-debug-console h1:first-child {
    padding-top: 0 !important
    }
.ls-debug-console ul {
    padding-top: 10px !important;
    list-style: none !important
    }
.ls-debug-console li {
    margin-left: 10px !important;
    font-size: 13px !important;
    position: relative !important;
    font-weight: normal !important
    }
html * .ls-debug-console li ul, body * .ls-debug-console li ul, #ls-global * .ls-debug-console li ul {
    display: none;
    width: 260px;
    left: -10px
    }
.ls-debug-console li ul {
    position: absolute !important;
    bottom: 100% !important;
    padding: 10px 10px 10px 0 !important;
    background: white !important;
    border-radius: 10px !important;
    box-shadow: 0 0 20px black !important
    }
html * .ls-debug-console li:hover ul, body * .ls-debug-console li:hover ul, #ls-global * .ls-debug-console li:hover ul {
    display: block
    }
.ls-debug-console li ul * {
    color: black !important
    }
.ls-debug-console a {
    text-decoration: none !important;
    border-bottom: 1px dotted white !important
    }
.ls-error {
    border-radius: 5px !important;
    -moz-border-radius: 5px !important;
    -wenkit-border-radius: 5px !important;
    background: white !important;
    height: auto !important;
    width: auto !important;
    color: white !important;
    padding: 20px 40px 30px 80px !important;
    position: relative !important;
    box-shadow: 0 2px 20px -5px black
    }
.ls-error p {
    line-height: normal !important;
    text-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: justify !important;
    font-family: Arial, sans-serif !important
    }
.ls-error .ls-error-title {
    line-height: 40px !important;
    color: red !important;
    font-weight: bold !important;
    font-size: 16px !important
    }
.ls-error .ls-error-text {
    color: #555 !important;
    font-weight: normal !important;
    font-size: 13px !important
    }
.ls-error .ls-exclam {
    width: 40px !important;
    height: 40px !important;
    position: absolute !important;
    left: 20px !important;
    top: 20px !important;
    border-radius: 50px !important;
    -moz-border-radius: 50px !important;
    -webkit-border-radius: 50px !important;
    font-size: 30px !important;
    font-weight: bold !important;
    color: white !important;
    line-height: 40px !important;
    background: red !important;
    text-align: center !important
    }
/* GPU Hardware Acceleration */
html * .ls-container .ls-shadow, html * .ls-container .ls-slide > *, html * .ls-container .ls-fullscreen, html * .ls-container .ls-3d-container, html * .ls-container .ls-lt-container, html * .ls-container .ls-lt-container *, html * .ls-container .ls-thumbnail-wrapper, html * .ls-container .ls-bottom-nav-wrapper, body * .ls-container .ls-shadow, body * .ls-container .ls-slide > *, body * .ls-container .ls-fullscreen, body * .ls-container .ls-3d-container, body * .ls-container .ls-lt-container, body * .ls-container .ls-lt-container *, body * .ls-container .ls-thumbnail-wrapper, body * .ls-container .ls-bottom-nav-wrapper, #ls-global * .ls-container .ls-shadow, #ls-global * .ls-container .ls-slide > *, #ls-global * .ls-container .ls-fullscreen, #ls-global * .ls-container .ls-3d-container, #ls-global * .ls-container .ls-lt-container, #ls-global * .ls-container .ls-lt-container *, #ls-global * .ls-container .ls-thumbnail-wrapper, #ls-global * .ls-container .ls-bottom-nav-wrapper, .ls-gpuhack {
    transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0)
    }
.ls-videohack {
    transform: none !important;
    -o-transform: none !important;
    -ms-transform: none !important;
    -moz-transform: none !important;
    -webkit-transform: none !important;
    transform-origin: none !important;
    -o-transform-origin: none !important;
    -ms-transform-origin: none !important;
    -moz-transform-origin: none !important;
    -webkit-transform-origin: none !important
    }
.ls-oldiepnghack {
    filter: none !important
    }
.ls-gpuhack {
    width: 100% !important;
    height: 100% !important
    }
html * .ls-container .ls-webkit-hack, body * .ls-container .ls-webkit-hack, #ls-global * .ls-container .ls-webkit-hack {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1
    }
/* GPU */
@media (transform-3d), (-o-transform-3d), (-ms-transform-3d), (-moz-transform-3d), (-webkit-transform-3d) {
    #ls-test3d {
        position: absolute;
        left: 9px;
        height: 3px
        }
    }
/*!
Video.js Default Styles (http://videojs.com)
Version 4.8.1
Create your own skin at http://designer.videojs.com
*/
/* SKIN
================================================================================
The main class name for all skin-specific styles. To make your own skin,
replace all occurances of 'vjs-default-skin' with a new name. Then add your new
skin name to your video tag instead of the default skin.
e.g. <video class="video-js my-skin-name">
*/
.vjs-default-skin {
    color: #ccc
    }
/* Custom Icon Font
--------------------------------------------------------------------------------
The control icons are from a custom font. Each icon corresponds to a character
(e.g. ""). Font icons allow for easy scaling and coloring of icons.
*/
@font-face {
    font-family: "VideoJS";
    src: url(../bundles/sqlifontevraud/desktop/css/fonts/vjs.eot);
    src: url(../bundles/sqlifontevraud/desktop/css/fonts/vjs.eot?#iefix) format("embedded-opentype"), url(../bundles/sqlifontevraud/desktop/css/fonts/vjs.woff) format("woff"), url(../bundles/sqlifontevraud/desktop/css/fonts/vjs.ttf) format("truetype"), url(../bundles/sqlifontevraud/desktop/css/fonts/vjs.svg#icomoon) format("svg");
    font-weight: normal;
    font-style: normal
    }
/* Base UI Component Classes
--------------------------------------------------------------------------------
*/
/* Slider - used for Volume bar and Seek bar */
.vjs-default-skin .vjs-slider {
    /* Replace browser focus hightlight with handle highlight */
    outline: 0;
    position: relative;
    cursor: pointer;
    padding: 0;
    /* background-color-with-alpha */
    background-color: #333;
    background-color: rgba(51, 51, 51, 0.9)
    }
.vjs-default-skin .vjs-slider:focus {
    /* box-shadow */
    -webkit-box-shadow: 0 0 2em #fff;
    -moz-box-shadow: 0 0 2em #fff;
    box-shadow: 0 0 2em #fff
    }
.vjs-default-skin .vjs-slider-handle {
    position: absolute;
    /* Needed for IE6 */
    left: 0;
    top: 0
    }
.vjs-default-skin .vjs-slider-handle:before {
    content: "";
    font-family: VideoJS;
    font-size: 1em;
    line-height: 1;
    text-align: center;
    text-shadow: 0 0 1em #fff;
    position: absolute;
    top: 0;
    left: 0;
    /* Rotate the square icon to make a diamond */
    /* transform */
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg)
    }
/* Control Bar
--------------------------------------------------------------------------------
The default control bar that is a container for most of the controls.
*/
.vjs-default-skin .vjs-control-bar {
    /* Start hidden */
    display: none;
    position: absolute;
    /* Place control bar at the bottom of the player box/video.
         If you want more margin below the control bar, add more height. */
    bottom: 0;
    /* Use left/right to stretch to 100% width of player div */
    left: 0;
    right: 0;
    /* Height includes any margin you want above or below control items */
    height: 3em;
    /* background-color-with-alpha */
    background-color: #07141e;
    background-color: rgba(7, 20, 30, 0.7)
    }
/* Show the control bar only once the video has started playing */
.vjs-default-skin.vjs-has-started .vjs-control-bar {
    display: block;
    /* Visibility needed to make sure things hide in older browsers too. */
    visibility: visible;
    opacity: 1;
    /* transition */
    -webkit-transition: visibility 0.1s, opacity 0.1s;
    -moz-transition: visibility 0.1s, opacity 0.1s;
    -o-transition: visibility 0.1s, opacity 0.1s;
    transition: visibility 0.1s, opacity 0.1s
    }
/* Hide the control bar when the video is playing and the user is inactive  */
.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
    display: block;
    visibility: hidden;
    opacity: 0;
    /* transition */
    -webkit-transition: visibility 1s, opacity 1s;
    -moz-transition: visibility 1s, opacity 1s;
    -o-transition: visibility 1s, opacity 1s;
    transition: visibility 1s, opacity 1s
    }
.vjs-default-skin.vjs-controls-disabled .vjs-control-bar {
    display: none
    }
.vjs-default-skin.vjs-using-native-controls .vjs-control-bar {
    display: none
    }
/* The control bar shouldn't show after an error */
.vjs-default-skin.vjs-error .vjs-control-bar {
    display: none
    }
/* IE8 is flakey with fonts, and you have to change the actual content to force
fonts to show/hide properly.
  - "	" IE8 hack didn't work for this
  - Found in XP IE8 from http://modern.ie. Does not show up in "IE8 mode" in IE9
*/
/* General styles for individual controls. */
.vjs-default-skin .vjs-control {
    outline: none;
    position: relative;
    float: left;
    text-align: center;
    margin: 0;
    padding: 0;
    height: 3em;
    width: 4em
    }
/* FontAwsome button icons */
.vjs-default-skin .vjs-control:before {
    font-family: VideoJS;
    font-size: 1.5em;
    line-height: 2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5)
    }
/* Replacement for focus outline */
.vjs-default-skin .vjs-control:focus:before, .vjs-default-skin .vjs-control:hover:before {
    text-shadow: 0 0 1em #fff
    }
.vjs-default-skin .vjs-control:focus {
    /*  outline: 0; */
    /* keyboard-only users cannot see the focus on several of the UI elements when
      this is set to 0 */
    }
/* Hide control text visually, but have it available for screenreaders */
.vjs-default-skin .vjs-control-text {
    /* hide-visually */
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
    }
/* Play/Pause
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-play-control {
    width: 5em;
    cursor: pointer
    }
.vjs-default-skin .vjs-play-control:before {
    content: ""
    }
.vjs-default-skin.vjs-playing .vjs-play-control:before {
    content: ""
    }
/* Playback toggle
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-playback-rate .vjs-playback-rate-value {
    font-size: 1.5em;
    line-height: 2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5)
    }
.vjs-default-skin .vjs-playback-rate.vjs-menu-button .vjs-menu .vjs-menu-content {
    width: 4em;
    left: -2em;
    list-style: none
    }
/* Volume/Mute
-------------------------------------------------------------------------------- */
.vjs-default-skin .vjs-mute-control, .vjs-default-skin .vjs-volume-menu-button {
    cursor: pointer;
    float: right
    }
.vjs-default-skin .vjs-mute-control:before, .vjs-default-skin .vjs-volume-menu-button:before {
    content: ""
    }
.vjs-default-skin .vjs-mute-control.vjs-vol-0:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before {
    content: ""
    }
.vjs-default-skin .vjs-mute-control.vjs-vol-1:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before {
    content: ""
    }
.vjs-default-skin .vjs-mute-control.vjs-vol-2:before, .vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before {
    content: ""
    }
.vjs-default-skin .vjs-volume-control {
    width: 5em;
    float: right
    }
.vjs-default-skin .vjs-volume-bar {
    width: 5em;
    height: 0.6em;
    margin: 1.1em auto 0
    }
.vjs-default-skin .vjs-volume-menu-button .vjs-menu-content {
    height: 2.9em
    }
.vjs-default-skin .vjs-volume-level {
    position: absolute;
    top: 0;
    left: 0;
    height: 0.5em;
    /* assuming volume starts at 1.0 */
    width: 100%;
    background: #66a8cc url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC") -50% 0 repeat
    }
.vjs-default-skin .vjs-volume-bar .vjs-volume-handle {
    width: 0.5em;
    height: 0.5em;
    /* Assumes volume starts at 1.0. If you change the size of the
         handle relative to the volume bar, you'll need to update this value
         too. */
    left: 4.5em
    }
.vjs-default-skin .vjs-volume-handle:before {
    font-size: 0.9em;
    top: -0.2em;
    left: -0.2em;
    width: 1em;
    height: 1em
    }
.vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content {
    width: 6em;
    left: -4em
    }
/* Progress
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-progress-control {
    position: absolute;
    left: 0;
    right: 0;
    width: auto;
    font-size: 0.3em;
    height: 1em;
    /* Set above the rest of the controls. */
    top: -1em;
    /* Shrink the bar slower than it grows. */
    /* transition */
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s
    }
/* On hover, make the progress bar grow to something that's more clickable.
    This simply changes the overall font for the progress bar, and this
    updates both the em-based widths and heights, as wells as the icon font */
.vjs-default-skin:hover .vjs-progress-control {
    font-size: 0.9em;
    /* Even though we're not changing the top/height, we need to include them in
          the transition so they're handled correctly. */
    /* transition */
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s
    }
/* Box containing play and load progresses. Also acts as seek scrubber. */
.vjs-default-skin .vjs-progress-holder {
    height: 100%
    }
/* Progress Bars */
.vjs-default-skin .vjs-progress-holder .vjs-play-progress, .vjs-default-skin .vjs-progress-holder .vjs-load-progress, .vjs-default-skin .vjs-progress-holder .vjs-load-progress div {
    position: absolute;
    display: block;
    height: 100%;
    margin: 0;
    padding: 0;
    /* updated by javascript during playback */
    width: 0;
    /* Needed for IE6 */
    left: 0;
    top: 0
    }
.vjs-default-skin .vjs-play-progress {
    /*
        Using a data URI to create the white diagonal lines with a transparent
          background. Surprisingly works in IE8.
          Created using http://www.patternify.com
        Changing the first color value will change the bar color.
        Also using a paralax effect to make the lines move backwards.
          The -50% left position makes that happen.
      */
    background: #66a8cc url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC") -50% 0 repeat
    }
.vjs-default-skin .vjs-load-progress {
    background: #646464 /* IE8- Fallback */;
    background: rgba(255, 255, 255, 0.2)
    }
/* there are child elements of the load progress bar that represent the
   specific time ranges that have been buffered */
.vjs-default-skin .vjs-load-progress div {
    background: #787878 /* IE8- Fallback */;
    background: rgba(255, 255, 255, 0.1)
    }
.vjs-default-skin .vjs-seek-handle {
    width: 1.5em;
    height: 100%
    }
.vjs-default-skin .vjs-seek-handle:before {
    padding-top: 0.1em /* Minor adjustment */
    }
/* Live Mode
--------------------------------------------------------------------------------
*/
.vjs-default-skin.vjs-live .vjs-time-controls, .vjs-default-skin.vjs-live .vjs-time-divider, .vjs-default-skin.vjs-live .vjs-progress-control {
    display: none
    }
.vjs-default-skin.vjs-live .vjs-live-display {
    display: block
    }
/* Live Display
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-live-display {
    display: none;
    font-size: 1em;
    line-height: 3em
    }
/* Time Display
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-time-controls {
    font-size: 1em;
    /* Align vertically by making the line height the same as the control bar */
    line-height: 3em
    }
.vjs-default-skin .vjs-current-time {
    float: left
    }
.vjs-default-skin .vjs-duration {
    float: left
    }
/* Remaining time is in the HTML, but not included in default design */
.vjs-default-skin .vjs-remaining-time {
    display: none;
    float: left
    }
.vjs-time-divider {
    float: left;
    line-height: 3em
    }
/* Fullscreen
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-fullscreen-control {
    width: 3.8em;
    cursor: pointer;
    float: right
    }
.vjs-default-skin .vjs-fullscreen-control:before {
    content: ""
    }
/* Switch to the exit icon when the player is in fullscreen */
.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before {
    content: ""
    }
/* Big Play Button (play button at start)
--------------------------------------------------------------------------------
Positioning of the play button in the center or other corners can be done more
easily in the skin designer. http://designer.videojs.com/
*/
.vjs-default-skin .vjs-big-play-button {
    left: 0.5em;
    top: 0.5em;
    font-size: 3em;
    display: block;
    z-index: 2;
    position: absolute;
    width: 4em;
    height: 2.6em;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    opacity: 1;
    /* Need a slightly gray bg so it can be seen on black backgrounds */
    /* background-color-with-alpha */
    background-color: #07141e;
    background-color: rgba(7, 20, 30, 0.7);
    border: 0.1em solid #3b4249;
    /* border-radius */
    -webkit-border-radius: 0.8em;
    -moz-border-radius: 0.8em;
    border-radius: 0.8em;
    /* box-shadow */
    -webkit-box-shadow: 0 0 1em rgba(255, 255, 255, 0.25);
    -moz-box-shadow: 0 0 1em rgba(255, 255, 255, 0.25);
    box-shadow: 0 0 1em rgba(255, 255, 255, 0.25);
    /* transition */
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s
    }
/* Optionally center */
.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button {
    /* Center it horizontally */
    left: 50%;
    margin-left: -2.1em;
    /* Center it vertically */
    top: 50%;
    margin-top: -1.4em
    }
/* Hide if controls are disabled */
.vjs-default-skin.vjs-controls-disabled .vjs-big-play-button {
    display: none
    }
/* Hide when video starts playing */
.vjs-default-skin.vjs-has-started .vjs-big-play-button {
    display: none
    }
/* Hide on mobile devices. Remove when we stop using native controls
    by default on mobile  */
.vjs-default-skin.vjs-using-native-controls .vjs-big-play-button {
    display: none
    }
.vjs-default-skin:hover .vjs-big-play-button, .vjs-default-skin .vjs-big-play-button:focus {
    outline: 0;
    border-color: #fff;
    /* IE8 needs a non-glow hover state */
    background-color: #505050;
    background-color: rgba(50, 50, 50, 0.75);
    /* box-shadow */
    -webkit-box-shadow: 0 0 3em #fff;
    -moz-box-shadow: 0 0 3em #fff;
    box-shadow: 0 0 3em #fff;
    /* transition */
    -webkit-transition: all 0s;
    -moz-transition: all 0s;
    -o-transition: all 0s;
    transition: all 0s
    }
.vjs-default-skin .vjs-big-play-button:before {
    content: "";
    font-family: VideoJS;
    /* In order to center the play icon vertically we need to set the line height
         to the same as the button height */
    line-height: 2.6em;
    text-shadow: 0.05em 0.05em 0.1em #000;
    text-align: center /* Needed for IE8 */;
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%
    }
.vjs-error .vjs-big-play-button {
    display: none
    }
/* Error Display
--------------------------------------------------------------------------------
*/
.vjs-error-display {
    display: none
    }
.vjs-error .vjs-error-display {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
    }
.vjs-error .vjs-error-display:before {
    content: "X";
    font-family: Arial;
    font-size: 4em;
    color: #666;
    /* In order to center the play icon vertically we need to set the line height
         to the same as the button height */
    line-height: 1;
    text-shadow: 0.05em 0.05em 0.1em #000;
    text-align: center /* Needed for IE8 */;
    vertical-align: middle;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -0.5em;
    width: 100%
    }
.vjs-error-display div {
    position: absolute;
    bottom: 1em;
    right: 0;
    left: 0;
    font-size: 1.4em;
    text-align: center;
    padding: 3px;
    background: #000;
    background: rgba(0, 0, 0, 0.5)
    }
.vjs-error-display a, .vjs-error-display a:visited {
    color: #F4A460
    }
/* Loading Spinner
--------------------------------------------------------------------------------
*/
.vjs-loading-spinner {
    /* Should be hidden by default */
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 4em;
    line-height: 1;
    width: 1em;
    height: 1em;
    margin-left: -0.5em;
    margin-top: -0.5em;
    opacity: 0.75
    }
/* Show the spinner when waiting for data and seeking to a new time */
.vjs-waiting .vjs-loading-spinner, .vjs-seeking .vjs-loading-spinner {
    display: block;
    /* only animate when showing because it can be processor heavy */
    /* animation */
    -webkit-animation: spin 1.5s infinite linear;
    -moz-animation: spin 1.5s infinite linear;
    -o-animation: spin 1.5s infinite linear;
    animation: spin 1.5s infinite linear
    }
/* Errors are unrecoverable without user interaction so hide the spinner */
.vjs-error .vjs-loading-spinner {
    display: none;
    /* ensure animation doesn't continue while hidden */
    /* animation */
    -webkit-animation: none;
    -moz-animation: none;
    -o-animation: none;
    animation: none
    }
.vjs-default-skin .vjs-loading-spinner:before {
    content: "";
    font-family: VideoJS;
    position: absolute;
    top: 0;
    left: 0;
    width: 1em;
    height: 1em;
    text-align: center;
    text-shadow: 0 0 0.1em #000
    }
@-moz-keyframes spin {
    0% {
        -moz-transform: rotate(0deg);
        } 100% {
        -moz-transform: rotate(359deg);
        }
    }
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        } 100% {
        -webkit-transform: rotate(359deg);
        }
    }
@-o-keyframes spin {
    0% {
        -o-transform: rotate(0deg);
        } 100% {
        -o-transform: rotate(359deg);
        }
    }
@keyframes spin {
    0% {
        transform: rotate(0deg);
        } 100% {
        transform: rotate(359deg);
        }
    }
/* Menu Buttons (Captions/Subtitles/etc.)
--------------------------------------------------------------------------------
*/
.vjs-default-skin .vjs-menu-button {
    float: right;
    cursor: pointer
    }
.vjs-default-skin .vjs-menu {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    /* (Width of vjs-menu - width of button) / 2 */
    width: 0;
    height: 0;
    margin-bottom: 3em;
    border-left: 2em solid transparent;
    border-right: 2em solid transparent;
    border-top: 1.55em solid #000;
    /* Same width top as ul bottom */
    border-top-color: rgba(7, 40, 50, 0.5);
    /* Same as ul background */
    }
/* Button Pop-up Menu */
.vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content {
    display: block;
    padding: 0;
    margin: 0;
    position: absolute;
    width: 10em;
    bottom: 1.5em;
    /* Same bottom as vjs-menu border-top */
    max-height: 15em;
    overflow: auto;
    left: -5em;
    /* Width of menu - width of button / 2 */
    /* background-color-with-alpha */
    background-color: #07141e;
    background-color: rgba(7, 20, 30, 0.7);
    /* box-shadow */
    -webkit-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
    -moz-box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2);
    box-shadow: -0.2em -0.2em 0.3em rgba(255, 255, 255, 0.2)
    }
.vjs-default-skin .vjs-menu-button:hover .vjs-menu {
    display: block
    }
.vjs-default-skin .vjs-menu-button ul li {
    list-style: none;
    margin: 0;
    padding: 0.3em 0 0.3em 0;
    line-height: 1.4em;
    font-size: 1.2em;
    text-align: center;
    text-transform: lowercase
    }
.vjs-default-skin .vjs-menu-button ul li.vjs-selected {
    background-color: #000
    }
.vjs-default-skin .vjs-menu-button ul li:focus, .vjs-default-skin .vjs-menu-button ul li:hover, .vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus, .vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover {
    outline: 0;
    color: #111;
    /* background-color-with-alpha */
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.75);
    /* box-shadow */
    -webkit-box-shadow: 0 0 1em #fff;
    -moz-box-shadow: 0 0 1em #fff;
    box-shadow: 0 0 1em #fff
    }
.vjs-default-skin .vjs-menu-button ul li.vjs-menu-title {
    text-align: center;
    text-transform: uppercase;
    font-size: 1em;
    line-height: 2em;
    padding: 0;
    margin: 0 0 0.3em 0;
    font-weight: bold;
    cursor: default
    }
/* Subtitles Button */
.vjs-default-skin .vjs-subtitles-button:before {
    content: ""
    }
/* Captions Button */
.vjs-default-skin .vjs-captions-button:before {
    content: ""
    }
/* Chapters Button */
.vjs-default-skin .vjs-chapters-button:before {
    content: ""
    }
.vjs-default-skin .vjs-chapters-button.vjs-menu-button .vjs-menu .vjs-menu-content {
    width: 24em;
    left: -12em
    }
/* Replacement for focus outline */
.vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before, .vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before {
    /* box-shadow */
    -webkit-box-shadow: 0 0 1em #fff;
    -moz-box-shadow: 0 0 1em #fff;
    box-shadow: 0 0 1em #fff
    }
/*
REQUIRED STYLES (be careful overriding)
================================================================================
When loading the player, the video tag is replaced with a DIV,
that will hold the video tag or object tag for other playback methods.
The div contains the video playback element (Flash or HTML5) and controls,
and sets the width and height of the video.

** If you want to add some kind of border/padding (e.g. a frame), or special
positioning, use another containing element. Otherwise you risk messing up
control positioning and full window mode. **
*/
.video-js {
    background-color: #000;
    position: relative;
    padding: 0;
    /* Start with 10px for base font size so other dimensions can be em based and
         easily calculable. */
    font-size: 10px;
    /* Allow poster to be vertially aligned. */
    vertical-align: middle;
    /*  display: table-cell; */
    /*This works in Safari but not Firefox.*/
    /* Provide some basic defaults for fonts */
    font-weight: normal;
    font-style: normal;
    /* Avoiding helvetica: issue #376 */
    font-family: Arial, sans-serif;
    /* Turn off user selection (text highlighting) by default.
         The majority of player components will not be text blocks.
         Text areas will need to turn user selection back on. */
    /* user-select */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
    }
/* Playback technology elements expand to the width/height of the containing div
    <video> or <object> */
.video-js .vjs-tech {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
    }
/* Fix for Firefox 9 fullscreen (only if it is enabled). Not needed when
   checking fullScreenEnabled. */
.video-js:-moz-full-screen {
    position: absolute
    }
/* Fullscreen Styles */
body.vjs-full-window {
    padding: 0;
    margin: 0;
    height: 100%;
    /* Fix for IE6 full-window. http://www.cssplay.co.uk/layouts/fixed.html */
    overflow-y: auto
    }
.video-js.vjs-fullscreen {
    position: fixed;
    overflow: hidden;
    z-index: 1000;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
    /* IE6 full-window (underscore hack) */
    _position: absolute
    }
.video-js:-webkit-full-screen {
    width: 100% !important;
    height: 100% !important
    }
.video-js.vjs-fullscreen.vjs-user-inactive {
    cursor: none
    }
/* Poster Styles */
.vjs-poster {
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: contain;
    cursor: pointer;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
    }
.vjs-poster img {
    display: block;
    margin: 0 auto;
    max-height: 100%;
    padding: 0;
    width: 100%
    }
/* Hide the poster when native controls are used otherwise it covers them */
.video-js.vjs-using-native-controls .vjs-poster {
    display: none
    }
/* Text Track Styles */
/* Overall track holder for both captions and subtitles */
.video-js .vjs-text-track-display {
    text-align: center;
    position: absolute;
    bottom: 4em;
    /* Leave padding on left and right */
    left: 1em;
    right: 1em
    }
/* Move captions down when controls aren't being shown */
.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
    bottom: 1em
    }
/* Individual tracks */
.video-js .vjs-text-track {
    display: none;
    font-size: 1.4em;
    text-align: center;
    margin-bottom: 0.1em;
    /* Transparent black background, or fallback to all black (oldIE) */
    /* background-color-with-alpha */
    background-color: #000;
    background-color: rgba(0, 0, 0, 0.5)
    }
.video-js .vjs-subtitles {
    color: #fff /* Subtitles are white */
    }
.video-js .vjs-captions {
    color: #fc6 /* Captions are yellow */
    }
.vjs-tt-cue {
    display: block
    }
/* Hide disabled or unsupported controls */
.vjs-default-skin .vjs-hidden {
    display: none
    }
.vjs-lock-showing {
    display: block !important;
    opacity: 1;
    visibility: visible
    }
/*  In IE8 w/ no JavaScript (no HTML5 shim), the video tag doesn't register.
    The .video-js classname on the video tag also isn't considered.
    This optional paragraph inside the video tag can provide a message to users
    about what's required to play video. */
.vjs-no-js {
    padding: 20px;
    color: #ccc;
    background-color: #333;
    font-size: 18px;
    font-family: Arial, sans-serif;
    text-align: center;
    width: 300px;
    height: 150px;
    margin: 0 auto
    }
.vjs-no-js a, .vjs-no-js a:visited {
    color: #F4A460
    }
/* -----------------------------------------------------------------------------
The original source of this file lives at
https://github.com/videojs/video.js/blob/master/src/css/video-js.less */