/* colors

.vert {	color: #1b9c19 }
.vert-light {color: #3dbe3b }
.vert-ultralight {color: #95ee93 }

.violet {color : #952067 }
.violet-light { color:#d7449d }
.violet-ultralight { color : #e998c9}

.rouge {color: #f74c34 }
.rouge-light {color: #f96e56 }
.rouge-ultralight {color: #fba396 }

.jaune {color: #fdba2c }
.jaune-light {color: #ffcc33 }
.jaune-ultralight {color: #fedb91 }

.bleu {color: #399aca }
.bleu-light {color: #5bbcec }
.bleu-ultralight {color: #89c3e0 }

.bleu-f {color: #384047 }

.noir {color: #222222;}
.gris-dark {color: #999999;}
.gris {#eee}
.gris-light {#fcfcfc}

.gris-coul-dark {color: #384047;}
.gris-coul {color: #657380;}
.gris-coul-light {color: #9ba6b0;}

*/



/* !GENERAL ============================================================================= */

* {transition:all 0.25s; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}

html, body, .pure-g [class *= "pure-u"] {
	font-size:100%/1.4;
	font-family: 'Oxygen', Helvetica, Arial, sans-serif;
}
html, body {
    color:#222;
    font-weight: 400;
}
    html {background: #384047} /* couleur du fond footer */
    body {background: #fff} /* vrai couleur fond de page */

p, ol, ul, dl, address {
    margin-bottom : 1.5em;
    font-size : 1.1em; /* 16 / 16 = 1 */
}

    ol.footnotes {font-size:0.8em; padding-left: 1.25em}

    ul {list-style-type: none;}

strong {font-weight: bold;}
em {font-style: italic; font-weight: inherit;}

img { border : 0; max-width: 100%; /* height: auto; width: auto\9; */ /* ie8 */ /* probleme avec width:auto et height:auto sous lte-ie9, ne respecte plus max-width, ni les valeurs en dur */ }

embed, object, iframe {max-width: 100%;}

blockquote {
    border-left: .25em solid #CCCCCC;
    color: #555;
    font-style: italic;
    line-height: 1.8;
    margin: 1.5em .5em 1.5em 1.5em;
    padding-left: 1.1em;
}

    blockquote em {font-style: normal}

.aligncenter {margin:auto;text-align: center;}
.alignright {float:right; margin:0 0 5px 5px;}
.alignleft {float:left; margin: 0 5px 5px 0;}
.centrer {text-align: center;}

.clearboth, .clear {clear: both;}
.hidden {display:none;}

.screen-reader-text {
	position: absolute;
	top:      -9999em;
	left:     -9999em;
}

.emoji {font-family: "Segoe UI Emoji"; letter-spacing: -.1em;}

.video {
    margin-left: 15px;
    margin-right: 15px;
  }

.l-box {padding: 1em; position: relative;}
.l-box-m {margin: 1em; position: relative;}
.l-box-list {position: relative; border: 1px #eee solid;}

    @media screen and (min-width: 35.5em) /* 568+ */ {
        article:nth-of-type(2n+1) .l-box-list {margin: 0 .5em 0 0;}
        article:nth-of-type(2n+0) .l-box-list {margin: 0 0 0 .5em;}
    }
    @media screen and (min-width: 48em) /* 768+ */ {
        article:nth-of-type(2n+1) .l-box-list, article:nth-of-type(2n+0) .l-box-list {margin: 0 0 0 1em;}
    }


/*-vendor specific-*/

html {
    -webkit-overflow-scrolling : touch;
    /* -webkit-tap-highlight-color : rgb(52,158,219);  */
    -webkit-text-size-adjust : 100%;
    -ms-text-size-adjust : 100%;
}

.clearfix { zoom : 1; }



/* !EMBED ============================================================================= */

.embed-container {text-align: center!important;}

.embed-container,
.embed-container.autoembed,
.embed-container.fullvid-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0!important;
    overflow: hidden;
    margin-bottom: 2em!important
}
.embed-container video,
.embed-container iframe,
.embed-container object,
.embed-container embed,
.embed-container.autoembed video,
.embed-container.autoembed iframe,
.embed-container.autoembed object,
.embed-container.autoembed embed,
.embed-container.fullvid-container video,
.embed-container.fullvid-container iframe,
.embed-container.fullvid-container object,
.embed-container.fullvid-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.player-cape {
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
    z-index: 10000;
    background: transparent;
    background-position: top left;
    background-repeat: no-repeat;
}


#cape-top {
/*outline: 1px red solid;*/
width: 100%;
height: 44%;
position: absolute;
top:0;
left: 0;
z-index: 10
}
#cape-bottom {
/*outline: 1px magenta solid;*/
width: 100%;
height: 38%;
position: absolute;
bottom:7%;
left: 0;
z-index: 10
}
#cape-left {
/*outline: 1px cyan  solid;*/
width: 44%;
height: 93%;
position: absolute;
top:0;
left: 0;
z-index: 10
}
#cape-right {
/*outline: 1px green  solid;*/
width: 45%;
height: 93%;
position: absolute;
top:0;
right: 0;
z-index: 10
}



.post img {width:100%; height: auto!important;}
.post img.notfull, .post .img.wp-smiley {width:auto!important}

.wp-video {margin-bottom: 2em !important}

.mejs-container{width:100%!important}


/* !LIENS ============================================================================= */

a:link, a:visited {text-decoration: none; color:#384047;}

a:hover, a:active {/* text-decoration: underline; */ color:#657380;}

a.lienimg {vertical-align:middle;border-bottom:0;}

a img, :link img, :visited img{ border:0; outline:none; text-decoration:none; }




/* !HEADING  ============================================================================= */

h1, h2, h3, h4 {font-family: 'Roboto Slab', 'helvetica neue', helvetica, arial, sans-serif; font-weight: normal!important; text-transform: uppercase; /*word-spacing: -0.08em;*/}
.pure-g h1[class *= "pure-u"], .pure-g h2[class *= "pure-u"], .pure-g h3[class *= "pure-u"], .pure-g h4[class *= "pure-u"], .pure-g h5[class *= "pure-u"], .pure-g h6[class *= "pure-u"] {font-family: 'Roboto Slab', 'helvetica neue', helvetica, arial, sans-serif;}

h1 {font-size : 2em; /* 32 / 16 */ line-height : 1.1; margin: 0; margin-bottom : 0.5em;}
h2 {font-size : 1.5em; /* 24 / 16 */ line-height : 1.2; margin-bottom : 1.5em;}
h3 { font-size : 1em; /* 16 / 16 */ line-height : 1.3; margin-bottom : 0.3em;}
h4 { font-size : .75em; /* 12 / 16  */ line-height : 1.25; margin-bottom : 0.5em; }
h5 { font-size : .5em; /* 8 / 16 */ margin-bottom : 1.25em; font-weight: 700; font-style: normal;}
h6 { font-size : .5em; /* 8 / 16  */ font-weight: 700; font-style: italic;}

    .single h1, .page h1 {font-size: 1.5em;}

    @media screen and (min-width: 40em) /* 640+ */ {
        h1, .single h1, .page h1 {font-size : 3em; }  /* 48 / 16 */
        h2 {font-size : 2em;}  /* 32 / 16 */
        h3 { font-size : 1em; } /* 24 / 16 */
        h4 { font-size : 1em;}  /* 16 / 16  */
        h5 { font-size : .75em; } /* 12 / 16 */
        h6 { font-size : .75em;}   /* 12 / 16  */
    }

    @media screen and (min-width: 64em) /* 1024+ */ {
        h1, .single h1, .page h1 {font-size : 3.5em;  } /* 48 / 16 */
        h2 {font-size : 2.125em; } /* 32 / 16 */
    }

    @media screen and (min-width: 85em) /* 1360+ */ {
/*         h1, .single h1, .page h1 {font-size : 4.625em;  } */ /* 74 / 16 */
        h2 {font-size : 2.125em; } /* 32 / 16 */
        h3 { font-size : 1.5em; } /* 24 / 16 */
        h4 { font-size : 1.25em;}  /* 20 / 16  */
        h5 { font-size : 1em;}  /* 16 / 16 */
        h6 { font-size : 1em;}  /* 16 / 16  */
    }


 h1 {
    padding: .25em 0;
    text-align: center;
}
     h1 small {font-size: 30%; display: block}

 h3 {
/*     border-top: 5px solid #9ba6b0; */
    margin-bottom: 0;
    padding: .25em 0;
    text-align: center;
}


/* !GLOBAL LAYOUT  ============================================================================= */

body {}

body>[id*=-wrapper] {width:100%; position: relative}

#content-wrapper {margin: 0 auto; top:0}

#footer-wrapper {background: #384047; }

    @media screen and (min-width: 48em) /* 768+ */ {
    }

    @media screen and (min-width: 64em) /* 1024+ */ {
    }

    @media screen and (min-width: 80em) /* 1280+ */ {
    }

    @media screen and (min-width: 85em) /* 1360+ */ {
        body>[id*=-wrapper] {margin: auto}
    }



/* !HEADER  ============================================================================= */

#logo {
    position: absolute;
    z-index: 2;
    left:0;
    margin-left: 0;
    top:.5em;
    text-indent: -20000em;
    background: transparent url('') center top no-repeat;
    width:95px;
    height: 30px;
    background-size:contain;
}
    #logo a { margin: 0; font-size : 1.5em; /* 40 / 16 */ display: block;}

    @media screen and (min-width: 64em) /* 1024+ */ {
       #logo {left:0; margin-left:0; /* top: 15px; height: 49px; */}
    }

    @media screen and (min-width: 80em) /* 1280+ */ {
        #logo {
            top:.5em;
            background: transparent url('') left top no-repeat;
            width:95px;
            height: 30px;
            background-size: contain; /* ?? sauf si modif image */
        }
    }

    @media (-webkit-min-device-pixel-ratio: 2), /* Webkit-based browsers */
       (min--moz-device-pixel-ratio: 2),    /* Older Firefox browsers (prior to Firefox 16) */
       (min-resolution: 2dppx),             /* The standard way */
       (min-resolution: 192dpi) {            /* dppx fallback */
        #logo {
            background: transparent url('') left top no-repeat;
            background-size: contain;
        }
    }

#logo-title {
    box-sizing: border-box;
    padding: 0 1em;
    margin: 1em auto 2em;
}
    #logo-title .subtitle {
        padding-right: 20em;
    }
#logotxt, #emojilogo {}
#logotxt {
    position: relative;
    z-index: 1;
    font-size: 3.5em;
    font-family: 'roboto slab';
    font-weight: 900;
    line-height: 1;
}
#logotxt>div {display: inline-block}
.emologotxt:after {
    margin-left: -.85em;
    letter-spacing: -16px
}
.o-first {color: transparent; background: url(https://twemoji.maxcdn.com/svg/1f60d.svg) no-repeat center center; background-size: 112%;}
.o-second {color: transparent; background: url(https://twemoji.maxcdn.com/svg/1f62e.svg) no-repeat center center; background-size: 112%;}
.o-third:after {content: ""}

#emojilogo {
    position: absolute;
    right: 0;
    top: -5em;
    height: 18em;
    width: 14.5em;
    z-index: -1;
    background: url(https://twemoji.maxcdn.com/svg/1f351.svg) no-repeat center center
}
@media screen and (min-width:60em) /* 768+ */ {
    #logotxt {
        font-size: 5em;
        line-height: normal;
        width: auto
    }
    #emojilogo {
        z-index:0;
        right: 6em;
        top: -6em;
    }
    #emojilogo:after {
        font-size: 15.75em;
    }
}
@media screen and (max-width: 40em) {
    #logo-title  {
        padding: 0;
        margin: 1em auto 1em;
    }

        #logo-title .subtitle{
            padding: 0;
            font-size: .8em;
            text-align: center;
        }

    #logotxt {
        font-size: 2.4em;
        text-align: center;
    }

    #emojilogo {
        height: 10em;
        width: 8em;
        top: -4em;
    }
}

@media screen and (max-width: 20em) {
    #logotxt {
        font-size: 2em;
    }
}


/* !Menu Principal */

#header-menu-wrapper {
    position: relative;
    width:100%;
    background: #384047;
    font-family: 'Roboto Slab', "helvetica neue", helvetica, arial, sans-serif;
    -webkit-backface-visibility: hidden;
}

    #header-menu-bar-wrapper {
        background: #a4bbcf;
        width: 100%;
        position: relative;
        z-index: 2;
        overflow: hidden
    }

        #header-menu-bar {
            /* background: #384047;  */
            clear: both;
            width: 90%;
            font-size: 1em;
            max-width: 85em;
            margin: 0 auto;
            padding: 0;
            position: relative;
        }

            @media screen and (min-width: 64em) /* 1024+ */ {
                #header-menu-bar {padding: 0;}
            }

            @media screen and (min-width: 80em) /* 1280+ */ {
                #header-menu-bar {width: 80%}
            }

            @media screen and (min-width: 106.25em) /* 1700+ */{
            }

            @media screen and (min-width: 140.1em) /* ~2240+ */ {
            }





/* !CONTENT  ============================================================================= */


#content {
    clear: both;
    padding: 1em 0 0;
    /* color: #333; */
    position: relative;
    z-index: 2
}

.shrink {
    width: 90%;
    max-width: 85em;
    margin: 0 auto;
    position: relative;
}
    @media screen and (min-width: 80em) /* 1280+ */ {
        .shrink {
            width: 80%;
        }
    }

.shrink.forced80 {width: 80%}


.entry {position: relative;}


#post-list {}

	#post-list article {margin-bottom: 1em}

	#post-list .l-box-list, #post-list h3, #post-list h2 {border-radius: 1em 1em 0 0}

    #post-list h3, #post-list h2 {margin-top: 0; border-top: none; text-shadow: none}

        #post-list h3 p, #post-list h2 p {margin:.5em 0}

        #post-list h3 a, #post-list h2 a {display: block; padding: .8em}
        #post-list h3 a:link, #post-list h3 a:visited, #post-list h2 a:link, #post-list h2 a:visited  {color: #fff;}
        #post-list h3 a:hover, #post-list h3 a:active, #post-list h2 a:hover, #post-list h2 a:active {color: #fcfcfc;}

    #post-list .metas {margin-bottom: 0; font-size: .8em}
        #post-list .metas li {margin-bottom: 0}

    h1.post-title {background: #fcfcfc; border: 1px #eee solid;}
    h1.post-title span { word-spacing: normal;  }

@media screen and (min-width: 48em) /* 768+ */ {
	#post-list {margin-right: 1em}
	    #post-list h1.post-title {margin-left: 16px}
}


h2.overImg,
h3.overImg {
    position: absolute;
    bottom: 0;
    z-index: 2;
    margin: 0;
    padding: 0;
    text-shadow: 1px 1px 2px #333;
    box-sizing: border-box;
    width:100%;
    /*background-color: #384047;*/
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(34, 34, 34, 0.00)), to(rgba(34, 34, 34, 1.00)));
    background-image: -webkit-linear-gradient(top, rgba(34, 34, 34, 0.00), rgba(34, 34, 34, 1.00));
    background-image: -moz-linear-gradient(top, rgba(34, 34, 34, 0.00), rgba(34, 34, 34, 1.00));
    background-image: -o-linear-gradient(top, rgba(34, 34, 34, 0.00), rgba(34, 34, 34, 1.00));
    background-image: -ms-linear-gradient(top, rgba(34, 34, 34, 0.00), rgba(34, 34, 34, 1.00));
    background-image: linear-gradient(top, rgba(34, 34, 34, 0.00), rgba(34, 34, 34, 1.00));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#00384047', EndColorStr='#ff384047');
}
h2.overImg a.post--title:link,
h2.overImg a.post--title:visited,
h3.overImg a.post--title:link,
h3.overImg a.post--title:visited {
    color:#fff;
    display: block;
    padding: 1em;
}
h2.overImg:hover a.post--title,
.entry:hover h2.overImg a.post--title,
h3.overImg:hover a.post--title,
.entry:hover h3.overImg a.post--title {
    /* color: #fff; */
    padding-bottom: 2.5em;
    border-bottom: none;
}



.post-thumbnail {line-height: 0; background-color: transparent}

.post-thumbnail.forced {
    display: block;
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
	z-index: 0;
}

.post-thumbnail.forced.ratio16-9 {padding: 56.25% 0 0 0;}
.post-thumbnail.forced.ratio4-3 {padding: 75% 0 0 0;}
.post-thumbnail.forced.ratio300-250 {padding: 83.33% 0 0 0;}
.post-thumbnail.forced.ratio1-1 {padding: 100% 0 0 0;}

.post-thumbnail.forced img {
    display: block;
    max-width: 100%;
/*     max-height: 100%; */
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    /* z-index: 1 */
}

.post.taxo-archive:hover .post-thumbnail.forced img.thumb--default {top:-2em}

.cat-title-row {
padding: .5em 1em;
margin-bottom: 1em;
box-sizing: border-box;
font-family: 'Roboto Slab',sans-serif;
text-transform: uppercase;
text-align: center;
background: #fcfcfc;
}
    .cat-title-row h2 {padding: 0; margin: 0; position:relative;}
    .cat-title-row h2:hover {}

        .cat-title-row h2 span {
            background: #fcfcfc;
            display: inline;
            padding: 0 .5em;
            position: relative;
        }

        @media screen and (max-width: 25em) {
            .cat-title-row h2 {font-size: 1.2em}
        }

        @media screen and (min-width: 48em) /* 768+ */ {
            .cat-title-row {
                padding: 1em 0 0;
                margin-bottom: 1em;
                background: none;
            }
            .cat-title-row h2 span {
                padding: 0 1em;
            }
        }



.row .social-likes {
    font-weight: bold;
    font-size: .9em;
    margin-bottom: 0;
    padding: .35em 0 .35em .35em;
    text-shadow: none;
}
    .row .social-likes:before {content: "•"; margin-right: .5em;}

.row .post {margin-bottom: 1em; position: relative}

.row h3.overImg {
    font-size:.875em;
}

.row .metas {
    display: inline-block;
    color: #fff;
    font-family: 'Oxygen', Helvetica, Arial, sans-serif;
    font-size: .8em;
    padding: .25em 0;
    text-shadow: none;
    text-transform: none;
    vertical-align: top;
    border-top: none;
    border-bottom: 1px #fcfcfc solid;
    margin-bottom: 1em;
    position: relative;
    font-weight: bold;
}
    .row .metas a {color:#fff}

    @media screen and (min-width: 48em) /* 768+ */ {
        .row h3.big {
            font-size: 1.75em;
        }
        .row h3.big .social-likes {
            font-size: .85em;
        }
        .row .big .metas {
            font-size: .6em;
            padding: .18em 0;
        }

    }

    .row a p {transition: color 0s;}


/* ROWS */
.type2-row {border-bottom: #eee 1px solid; margin: 1em auto;}
.type2-row a.post--title {display: block}

    @media screen and (min-width: 48em) /* 768+ */ {
        .type2-row {border-bottom: none; margin: 0 auto; padding: 1em 0 0 0;}
    }

    @media screen and (min-width: 80em) /* 1280+ */ {
        .type2-row {padding: 1em 0 0 0}
    }


/* type2-row : 6 blocs */
.type2-row {
    padding: 0;
}

.type2-row .cat-title-row {text-align: center; padding: 0 0 0;}

    .type2-row .cat-title-row h2 a {
        font-family: 'Roboto Slab',helvetica, arial, sans-serif;
        font-weight: 300;
        position: relative;
    }


.type2-row .l-box {
    padding: 0;
}
.type2-row [class *= 'pure-u']:nth-child(odd) .l-box {
    padding-right: 0.5em;
}
.type2-row [class *= 'pure-u']:nth-child(even) .l-box {
    padding-left: 0.5em;
}

.type2-row h3 {
    font-size: 0.8em;
    text-align: center;
    border-top: none;
}
    @media screen and (min-width: 64em) /* 1024+ */ {
        .type2-row h3 {
            font-size: 1em;
        }
    }

.type2-row .entry:hover a {color:#657380;}
.type2-row.light .entry:hover a {color:#657380}

.type2-row .metas {background: none; border:none; margin: 0; color:#384047; font-size: .9em}
    .type2-row .metas .post--date {display: block; color:#384047}
    .type2-row .social-likes:before {content: none; margin-right: 0}
    .type2-row .social-likes {background: none; border-bottom:1px solid #384047}


    @media screen and (min-width: 48em) /* 768+ */ {
        .type2-row {
            padding: 0 0 .5em 1em;
            background-color: #384047;
        }
        .type2-row.light {background: #a52b2b}

            .type2-row .cat-title-row {
                padding-top: .5em;
                margin-bottom: 1em;
                padding-right: 1em
            }

                .type2-row .cat-title-row h2 a, .type2-row .cat-title-row h2 span {
                    background: #384047;
                    color: #fff;
                }
                .type2-row.light .cat-title-row h2 a, .type2-row .cat-title-row h2 span {
                    background: #9ba6b0;
                }
                .type2-row .cat-title-row h2 a, .type2-row .cat-title-row h2 span {
                    text-shadow: 1px 1px #222;
                }

        .type2-row .shrink {
            width: calc(90% + 2em)
        }

        .type2-row [class *= 'pure-u']:nth-child(odd) .l-box, .type2-row [class *= 'pure-u']:nth-child(even) .l-box {
            padding: 0;
            padding-right: 1em;
        }

        .type2-row a {color: #fff;}
        .type2-row a:hover, .type2-row .entry:hover a {color:#9ba6b0;}

        .type2-row .metas {color: #fff;}
            .type2-row .metas .post--date {color: #fff}

    }

    @media screen and (min-width: 64em) /* 1024+ */ {
        .type2-row .shrink {
            width: calc(90% + 2em - 2px);
        }
        .type2-row .metas {font-size: .8em}
    }

    @media screen and (min-width: 80em) /* 1280+ */ {
        .type2-row .shrink {
            width: calc(80% + 2em - 4px);
        }
    }



/* HOME */

#featured-posts {
    margin-bottom:1em;
    padding-top: 1em;
    background: #fcfcfc;
}
    @media screen and (max-width:35.4em) /* 568- */ {
       #featured-posts article .l-box-list {margin: 0 1em 0 1em}
    }
    @media screen and (min-width:35.45em) and (max-width:47.95em) /* between 568 & 768 */ {
       #featured-posts article:nth-of-type(2n+0) .l-box-list {margin: 0 .5em 0 1em}
       #featured-posts article:nth-of-type(2n+1) .l-box-list {margin: 0 1em 0 .5em}
       #featured-posts article.firstinlist .l-box-list {margin: 0 1em 0 1em}
    }

    @media screen and (min-width: 48em) /* 768+ */ {
        #featured-posts{
            margin-left: 1em;
            padding-right: 1em
        }
            #featured-posts .cat-title-row {
                margin-left: 1em;
            }
    }

#featured-posts .metas li.metas--views::after {
    content: '•';
    padding-left: 1em;
}

#featured-posts article .post-thumbnail.forced {padding:56.25% 0 0 0}

    @media screen and (min-width: 35.5em) /* 568+ */ {
        #featured-posts article.pure-u-1 .post-thumbnail.forced {padding:83.33% 0 0 0}
        #featured-posts article.firstinlist .post-thumbnail.forced {padding:56.25% 0 0 0}
    }

    @media screen and (min-width: 64em) /* 1024+ */ {
        #featured-posts article.firstinlist .post-thumbnail.forced {padding:83.33% 0 0 0}
    }

    @media screen and (min-width: 80em) /* 1280+ */ {
        .home #content-wrapper, .home #footer-wrapper {top: 0;}
    }

.filter-buttons {
    margin-bottom: 1em;
    text-align: center;
    position: relative
}

    #filter {
        position:absolute;
        top:-4em;
        left:0;
    }

    .filter-buttons a {
        font-size: .875em;
        background: #fff;
        padding-right: .35em;
        margin-right: .3em;
        border-right: 1px #ccc solid;
    }
        .filter-buttons a:last-child {
            border:none;
            padding-right: 0;
            margin-right: 0;
        }

    @media screen and (min-width:35.5em) {
        .filter-buttons {
            background: #fcfcfc;
        }

            .filter-buttons a, .filter-buttons a:last-child {
                padding: .15em 1em;
                margin-right: 1em;
                border: none;
            }

    }

    @media screen and (min-width: 48em) /* 768+ */ {
        .filter-buttons {
            text-align: right;
            margin-left: 1em;
        }

            .filter-buttons a:last-child {
                padding-right: 0;
                margin-right: 0
            }
    }

.home #primary-postlist article ul {
	padding: 0;
	margin: 0;
    max-height: 25em;
    overflow-y: auto;
}
@media screen and (max-width: 48em) /* 768+ */ {

	.home #primary-postlist article ul {
        max-height: 19.5em;
	}

}

    .home #primary-postlist article ul li {font-size:.9em; padding: .5em; position: relative}

        .home #primary-postlist article ul li:nth-child(even) {background: #fff;}
        .home #primary-postlist article ul li:nth-child(odd) {background: #fcfcfc;}

    .home #post-list h3 {background: #384047; font-size: 1em;}
    	.home #post-list h3:hover {background: #657380}
    .home #post-list h2 {background: #384047; font-size: 1.05em;margin:0;text-align:center; }
        .home #post-list h2:hover {background: #657380}

		#primary-postlist article ul li a.hot:after, #primary-postlist article ul li a.up:after, #primary-postlist article ul li a.new:after, #primary-postlist article ul li a.hard:after, #primary-postlist article ul li a.french:after, #primary-postlist article ul li a.welike:after, #primary-postlist article ul li a.gay:after, #primary-postlist article ul li a.fav:after, #primary-postlist article ul li a.fem:after { display: inline-block; content: ' '; width: 1em; height: 1em; background: no-repeat center center;}

		#primary-postlist article ul li a.hot:after { background-image: url("https://twemoji.maxcdn.com/svg/1f525.svg") }
		#primary-postlist article ul li a.up:after { background-image: url("https://twemoji.maxcdn.com/svg/1f346.svg") }
		#primary-postlist article ul li a.new:after { background-image: url("https://twemoji.maxcdn.com/svg/1f195.svg") }
		#primary-postlist article ul li a.hard:after { background-image: url("https://twemoji.maxcdn.com/svg/1f631.svg") }
		#primary-postlist article ul li a.french:after { background-image: url("https://twemoji.maxcdn.com/svg/1f1eb-1f1f7.svg") }
		#primary-postlist article ul li a.welike:after { background-image: url("https://twemoji.maxcdn.com/svg/1f60d.svg") }
		#primary-postlist article ul li a.gay:after { background-image: url("https://twemoji.maxcdn.com/svg/1f308.svg") }
		#primary-postlist article ul li a.fav:after { background-image: url("https://twemoji.maxcdn.com/svg/2665.svg") }
		#primary-postlist article ul li a.fem:after { background-image: url("https://twemoji.maxcdn.com/svg/1f483.svg") }

		.home #primary-postlist article ul li a+a,
        .home #primary-postlist article ul li a+span {display: block; position: absolute; right: .5em; top: 50%; transform: translate(0, -50%); width: 1em; height: 1em;}
		    .home #primary-postlist article ul li a+a:hover {}
    		.home #primary-postlist article ul li a+a:after {content: " "; background: url("https://twemoji.maxcdn.com/svg/1f50d.svg") no-repeat center center; opacity: .5; display: block; height: 1em; width: 1em;}
                .home #primary-postlist article ul li a+a:hover:after {opacity: 1}
            .home #primary-postlist article ul li a+span:after {content: " "; background: url("https://twemoji.maxcdn.com/svg/1f6a7.svg") no-repeat center center; opacity: .5; display: block; height: 1em; width: 1em;}
    .home #post-list article div > p { padding: .5em; margin: 0; font-size: .85em; text-align: center; background: #6a7987; color: white; }


#a-propos {
    margin-top: 1em;
    padding: 0 1em
}
    #a-propos h3 {border-top: 1px #eee solid; padding-top: 1em}
    .home #a-propos h2 {border-top: 1px #eee solid; padding-top: 1em;margin-bottom:0;text-align:center;    font-size: 1.5em;}
    #a-propos p {line-height: 1.7; color:#555}

/* !METAS */

.metas {
    padding: 1em 0 0;
    margin: 0;
    border-top: 1px solid #9ba6b0;
    border-bottom: 1px solid #9ba6b0;
    margin-bottom: 2em;
    text-align: center
}
ul.metas {font-size: .8em}

    .metas li {
        margin-right: 1em;
        display: inline-block;*display:inline;
        zoom:1;
        margin-bottom: 1em;
    }
        .metas li:last-child {margin-right: 0}
        .metas li:after {
            content: '•';
            padding-left: 1em;
        }
        .metas span.fa {margin-right: .25em; margin-bottom: 0;}
        .metas span.fa:after,
        .metas li.metas--tags:after,
        .metas .metas--tags li:after,
        .metas .social-likes span:after,
        .metas li.metas--votes:after,
        .metas li.metas--views:after,
        .metas li.metas--pstars:after,
        .metas li.metas--studios:after,
        .metas li.metas--source:after,
        .metas .metas--pstars li::after,
        .metas .metas--studios li::after,
        .metas .metas--source li::after,
        .metas li:last-child::after {content: ''; padding: 0}

    .metas .metas--social span {margin-bottom: 0;}
    .metas .metas--social span span {margin-right: 0}
    .metas .metas--social .social-likes__widget:last-of-type {margin-right: 0}
    .metas .metas--social .social-likes__counter:last-of-type:before {padding-right: 0}

    .metas--tags ul,
    .metas--pstars ul,
    .metas--studios ul,
    .metas--source ul {
        margin: 0;
        padding: 0
    }
    .metas--tags li,
    .metas--pstars li,
    .metas--studios li,
    .metas--source li {
        margin-right: .25em;
        margin-bottom: .25em;
        text-transform: capitalize;
    }
    .metas--source li {
        margin-right: 1em
    }
        .metas--tags li a,
        .metas--pstars li a,
        .metas--studios li a,
        .metas--source li a {
            padding: .25em .5em;
            border: 1px #eee solid;
            display: block;
        }
        .metas--tags li a:hover,
        .metas--source li a:hover {
            background: #fcfcfc;
        }


    .metas.post--end {text-align: left; padding-top: 0}

        .metas.post--end .metas--votes,
        .metas.post--end .metas--views,
        .metas.post--end .metas--source {
            box-sizing: border-box;
            margin-right: 0;
            border-bottom: 1px #eee solid;
        }

        .metas.post--end .metas--votes {
            padding-top: .5em;
            border-right: 1px #eee solid;
            text-align: center;
        }

        .metas.post--end .metas--views {
            padding-top: 1em;
            padding-left: 1em;
            padding-bottom: .75em;
            text-align: center;
        }

        .metas.post--end .metas--source {
            border-right: none;
            padding-bottom: .75em
        }

        .metas.post--end .metas--tags,
        .metas.post--end .metas--pstars,
        .metas.post--end .metas--studios {
            border-bottom: 1px #eee solid;
            margin: 0;
            padding-bottom: .75em;
            margin-bottom: 1em;
        }

            .metas.post--end .metas--pstars ul,
            .metas.post--end .metas--studios ul,
            .metas.post--end .metas--tags ul,
            .metas.post--end .metas--source ul {
                display: inline-block;
                vertical-align: top;
                margin: 0;
                padding: 0;
            }

            .metas.post--end .metas--pstars span,
            .metas.post--end .metas--studios span,
            .metas.post--end .metas--tags span,
            .metas.post--end .metas--source span {
                padding: .25em 0;
                display: inline-block;
                margin-right: .5em
            }

            .metas.post--end .metas--source li a {
                display: inline-block
            }


    .metas.metas--postlist-time {
        position: absolute;
        top: 1.5em;
        right: -.25em;
        border: none;
        padding: 0 .25em .25em;
        text-align: left;
        font-size: .85em;
        background-color: #fff;
        color: #222
    }

    .metas.metas--postlist-tags {
        position: absolute;
        bottom: 0;
        left: 0;
        border: none;
        height: 1.5em;
        line-height: 1.5em;
        z-index: 2;
        width: 100%;
        margin: 0;
        padding: 0;
        overflow: hidden
    }

        #post-list .metas--postlist-tags li {
            background-color:#fff;
            opacity: .4;
            margin: 0;
            margin-left: .25em;
            margin-bottom: .5em;
            font-size: .85em;
        }
        #post-list .metas--postlist-tags li:hover {opacity: 1}

            .metas--postlist-tags li:after {
                content: '';
                padding-left: 0;
            }

            #post-list .metas--postlist-tags li a {
                color: #222;
                padding: .5em
            }

        .entry:hover .metas--postlist-tags, .post.taxo-archive:hover h3.overImg {
            border-bottom: #657380 8px solid;
            padding-bottom: .25em
        }


    @media screen and (min-width: 40em) /* 640+ */ {

        ul.metas {font-size: 1em}

    }

    @media screen and (min-width: 48em) /* 768+ */ {

        .metas.post--end .metas--votes {
            padding: 0;
            padding-top: .75em;
        }

        .metas.post--end .metas--views {
            border-right: 1px #eee solid;
            padding-top: 1.25em;
        }

        .metas.post--end .metas--source {
            padding-top: 1em;
            padding-left: 1em;
        }

    }





/* !SINGLE */
    @media screen and (max-width: 64em) /* 1024- */ {
        .single article.shrink.forced80, .single #advHeader {width: 90%}
    }

.single article header, .page article header {text-align: center; position: relative}
    .single .sponso--mark {top:-1em; left:-1em}

.single h1, .page h1 {
    padding: .5em 0;
    line-height: .75;
}

    .single h1 small {
        display: inline-block;
        font-size: 50%;
        color: #9ba6b0;
    }

.single .post--video {
    margin-top: 2em
}




.single .main-entry>.l-box, .page .main-entry>.l-box {
    padding: 0;
}

@media screen and (min-width: 64em) /* 1024+ */ {
    .single .main-entry>.l-box, .page .main-entry>.l-box {
        /* padding: 0 3em 0 0; */
        padding: 0 1em 0 0;
    }
}

.single .main-entry .thumbnail {padding: 1em 0}
    .single .main-entry .thumbnail a.lientxt {
        font-size: 1.8em;
        font-weight: bold;
        margin-top: .5em;
        margin-bottom: 2em;
        padding: .5em;
        display: flex;
        background: #fcfcfc;
        border: 1px #eee solid;
        text-align: center;
        align-items: center;
        justify-content: center;
    }
        .single .main-entry .thumbnail a.lientxt span { display: block; }
        .single .main-entry .thumbnail a.lientxt:before {content:' '; display: block; height: .8em; width: .8em; background: url("https://twemoji.maxcdn.com/svg/1f449.svg") no-repeat center center; margin-right: .3em;}
        .single .main-entry .thumbnail a.lientxt:after {content:' '; display: block; height: .8em; width: .8em; background: url("https://twemoji.maxcdn.com/svg/1f448.svg") no-repeat center center; margin-left: .3em;}

.single .main-entry .thumbnail {padding: 1em 0}
    .single .main-entry .thumbnail a.lientxtb {
            font-size: 1.4em;
            color: #ffffff;
            font-weight: bold;
            padding: .5em;
            display: flex;
            background: #9ba6af;
            border: 1px #eee solid;
            text-align: center;
            align-items: center;
            justify-content: center;
        }
            .single .main-entry .thumbnail a.lientxtb span { display: block; }

.single .main-entry p, .page .main-entry p, .archive .main-entry p {
    color: #333;
    line-height: 1.7;
    text-align: left;
}
    .single .main-entry p:first-of-type {
        font-size: 110%;
        margin-top: 0
    }
    .single .main-entry p:first-of-type, .single .main-entry p:first-of-type>span {
        font-weight: 600!important;
    }

/* css video */

.single .video>.l-box, .page .main-entry>.l-box {
    padding: 0;
}

@media screen and (min-width: 64em) /* 1024+ */ {
    .single .video>.l-box, .page .main-entry>.l-box {
        /* padding: 0 3em 0 0; */
        padding: 0 1em 0 0;
    }
}

.single .video .thumbnail {padding: 1em 0}
    .single .video .thumbnail a.lientxt {
        font-size: 1.8em;
        font-weight: bold;
        margin-top: .5em;
        margin-bottom: 2em;
        padding: .5em;
        display: flex;
        background: #fcfcfc;
        border: 1px #eee solid;
        text-align: center;
        align-items: center;
        justify-content: center;
    }
        .single .video .thumbnail a.lientxt span { display: block; }
        .single .video .thumbnail a.lientxt:before {content:' '; display: block; height: .8em; width: .8em; background: url("https://twemoji.maxcdn.com/svg/1f449.svg") no-repeat center center; margin-right: .3em;}
        .single .video .thumbnail a.lientxt:after {content:' '; display: block; height: .8em; width: .8em; background: url("https://twemoji.maxcdn.com/svg/1f448.svg") no-repeat center center; margin-left: .3em;}

.single .video .thumbnail {padding: 1em 0}
    .single .video .thumbnail a.lientxtb {
            font-size: 1.5em;
            color: #ffffff;
            font-weight: bold;
            padding: .5em;
            display: flex;
            background: #9ba6af;
            border: 1px #eee solid;
            text-align: center;
            align-items: center;
            justify-content: center;
        }
            .single .video .thumbnail a.lientxtb span { display: block; }

.single .video p, .page .video p, .archive .video p {
    color: #333;
    line-height: 1.7;
    text-align: left;
}

/* end video */

.site-ratings {margin-bottom: 1.5em}
    .site-ratings--title {
        display: inline-block;
        font-size: 2.5em;
        font-weight: 700;
    }
    .site-ratings--css {
      unicode-bidi: bidi-override;
      font-size: 4em;
      height: 1em;
      width: 5em;
      display: inline-block;
      position: relative;
      padding: 0;
    }
        .site-ratings--css-top {
          padding: 0;
          position: absolute;
          z-index: 1;
          display: block;
          top: 0;
          left: 0;
          overflow: hidden;
          height: 1.1em;
          white-space: nowrap;
        }
        .site-ratings--css-bottom {
          padding: 0;
          display: block;
          z-index: 0;
          opacity: .5;
          white-space: nowrap;
        }
            .site-ratings--css-top span:after, .site-ratings--css-bottom span:after {display: inline-block; content: ' '; background: url(https://twemoji.maxcdn.com/svg/1f4a6.svg) no-repeat top left; height: 1em; width: 1em; }

.single .main-entry h2, .page .main-entry h2 {font-size: 1.5em}
.single .main-entry h3, .page .main-entry h3 {font-size: 1em}

    /* hyphens */
    .single .main-entry p, .single .main-entry p a, .page .main-entry p, .page .main-entry p a {
        word-wrap: break-word;
        -webkit-hyphens: auto;
        -webkit-hyphenate-character : "\2010";
        -webkit-hyphenate-limit-after : 3;
        -webkit-hyphenate-limit-before : 3;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        -o-hyphens: auto;
        hyphens: auto;
    }

.single .main-entry .img-container, .page .main-entry .img-container {
    margin-bottom : 1.5em;
    margin-top: 1em;
}

.single .main-entry a:not(.lienimg), .page .main-entry a:not(.lienimg) {border-bottom:1px #5dadec solid; color: #e75a70}
.single .main-entry .img-container a, .page .main-entry .img-container a {border: none}

.single .main-entry a:hover, .single .main-entry a:active, .page .main-entry a:hover, .page .main-entry a:active {border-color:#9ba6b0; color:#9ba6b0}

.single .main-entry blockquote p, .page .main-entry blockquote p {
    font-size: inherit;
    color: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0;
    /* -webkit-hyphens: none; */
}
.single .main-entry blockquote:before,
.single .main-entry blockquote:after,
.page .main-entry blockquote:before,
.page .main-entry blockquote:after {content: '';}

.single .main-entry blockquote p:before,
.page .main-entry blockquote p:before {content: '\000022\0000a0'}

.single .main-entry blockquote p:after,
.page .main-entry blockquote p:after {content: '\0000a0\000022'}

.single img.nsfw, .page img.nsfw {
    visibility:hidden;
    cursor: pointer;
}
.single .nsfw-mask,
.page .nsfw-mask {
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    display: block;
    background: #000 /* rgba(0,0,0,0.8) */;
    color:#eee;
    text-align: center;
    cursor: pointer;
}
    .single .nsfw-mask div,
    .page .nsfw-mask div {position: absolute; top:50%; left:50%; margin: -29px 0 0 -93px;}
        .single .nsfw-mask span,
        .page .nsfw-mask span { font-size: 2em; font-family: 'Roboto Slab', Helvetica, Arial, sans-serif; font-weight:normal!important; text-transform: uppercase; letter-spacing: 0.01em; }




.wp-caption {width: 100%!important}
.single .main-entry p.wp-caption-text, .page .main-entry p.wp-caption-text {text-align: center;font-size: .9em;}


iframe.twitter-tweet {
    width:85%!important;
    margin: 20px auto!important;
}


.txt-fiche {
	margin-top: 1em;
	border-bottom: #eee 1px solid;
	padding-bottom: 1em
}

.fiche-image {line-height: 0;}

.fiche-info {margin-top: 1em}
.fiche-info--desc {margin: 1em 0}
	.archive #post-list .fiche-info--desc h2 {margin-left: 0; text-align: left; font-size: 1.125em;}


#avis-wrapper {margin-top: 2.5em}

.avis {
    position: relative;
    background: #fcfcfc;
    border: 1px #eee solid;
    padding: .5em;
    padding-top: 1.75em;
    margin: 0 0 2em;
    text-align: left;
}
    .avis--title {
        font-size: 1.5em;
        font-weight: bold;
        text-transform: uppercase;
        padding: .25em .25em .25em 2.5em;
        width: 80%;
        position: absolute;
        top: -.5em;
        left: -.5em;
        background: #384047;
        color: #fff;
        text-shadow: 1px 1px #222;
    }
        .lesplus .avis--title:before, .lesmoins .avis--title:before {
            position: absolute;
            font-size: 3em;
            top: -.2em;
            left: -.25em;
        }
        .lesplus .avis--title:before {
            content: ' '; display: block; background: url(https://twemoji.maxcdn.com/svg/1f60d.svg) no-repeat center center; height: 1em; width: 1em;
        }
        .lesmoins .avis--title:before {
            content: ' '; display: block; background: url(https://twemoji.maxcdn.com/svg/1f620.svg) no-repeat center center; height: 1em; width: 1em;
        }

    .avis ul {margin-bottom: 1em}
        .avis.lesplus ul li:before {content: " "; display: inline-block; vertical-align: bottom; height: 1.2em; width: 1.2em; background: url("https://twemoji.maxcdn.com/svg/1f600.svg") no-repeat center center; margin-right: .5em;}
        .avis.lesmoins ul li:before {content: " "; display: inline-block; vertical-align: bottom; height: 1.2em; width: 1.2em; background: url("https://twemoji.maxcdn.com/svg/1f615.svg") no-repeat center center; margin-right: .5em;}

@media screen and (min-width: 48em) /* 768+ */{

	.txt-fiche {margin-left: 1em}

	.fiche-image {
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
	}
	.fiche-image img {display: none}

	.fiche-info {margin-top: 0}

	.archive .fiche-info ul {padding-left: 0}
	.archive .fiche-info--desc {
		columns: auto 2;
		column-gap: 2em;
		-webkit-column-break-inside: avoid;
		-moz-column-break-inside: avoid;
		-moz-page-break-inside: avoid;
		page-break-inside: avoid;
		break-inside: avoid-column;
	}

}


.single .type2-row .cat-title-row h2,
.page .type2-row .cat-title-row h2,
.archive .type2-row .cat-title-row h2 {
    font-family: 'Roboto Slab',helvetica, arial, sans-serif;
    font-weight: 300;
    background-color: #fff;
    padding: 0 1em;
    position: relative;
}

.single .type2-row .cat-title-row h2:before,
.page .type2-row .cat-title-row h2:before,
.archive .type2-row .cat-title-row h2:before {
    content: ' ';
    display: inline-block;
    height: 1em;
    width: 1em;
    background: url("https://twemoji.maxcdn.com/svg/1f44d.svg") no-repeat center center;
}

.single .type2-row ul, .page .type2-row ul, .archive .type2-row ul {padding: 0}

.single .type2-row .metas,
.page .type2-row .metas,
.archive .type2-row .metas {
    border-bottom:1px #384047 solid;
}

    .single .type2-row .metas li:first-child:after,
    .page .type2-row .metas li:first-child:after,
    .archive .type2-row .metas li:first-child:after {
        content: '•';
        padding-left: 1em;
    }

    @media screen and (min-width: 48em) /* 768+ */ {
        .single .type2-row.light,
        .single .type2-row.light .cat-title-row h2,
        .page .type2-row.light,
        .page .type2-row.light .cat-title-row h2,
        .archive .type2-row.light,
        .archive .type2-row.light .cat-title-row h2 {
            background: #9ba6b0;
        }

        .single .type2-row .cat-title-row,
        .page .type2-row .cat-title-row,
        .archive .type2-row .cat-title-row {
            padding-top: 1em;
        }

        .single .type2-row .cat-title-row h2,
        .page .type2-row .cat-title-row h2,
        .archive .type2-row .cat-title-row h2 {
            background: #384047;
            color: #fff;
        }

        .single .type2-row h3 .metas,
        .page .type2-row h3 .metas,
        .archive .type2-row .metas {
            border-color:#657380;
        }
    }



/* NAVIGATION & WP PageNavi Plugin */
.pagination { width: 100%; text-align: center; margin: 1em auto; border-top: #eee 1px solid; padding-top: 1em; font-size: 1em}
.pagination p { margin: 0; font-weight: normal; text-align: center; display: inline-block;}
.pagination p.nav-ellipsis, .pagination p.puretext {margin-right: 5px}
.pagination a.current { background-color: #9ba6b0; color: #fff; border: none; }
.pagination a:hover { background-color: #9ba6b0; color: #fff; text-decoration: none; }
.pagination a, .pagination p.puretext { font-weight: normal; padding: 6px 10px; line-height: 45px; margin-right: 5px; border: none; }
.pagination .current { padding: 6px 10px; background-color: #9ba6b0; color: #fff; border: none; margin-right: 5px; }
.pagination a:hover, div.pagination .nextpostslink:hover a, div.pagination .previouspostslink:hover a { background-color: #9ba6b0; color: #fff; text-decoration: none; }
.pagination .pages { margin-right: 10px; display: none; }
.pagination .extend { border: none; }
.pagination .alignleft, .navigation .alignright { margin: 0; }
.pagination .alignleft a { margin: 0 0 0 10px; }
.pagination .alignright a { margin: 0 10px 0 0; }

.single .main-entry .pagination p {font-size: 1em}
.single .main-entry .pagination p.nav-ellipsis, .single .main-entry .pagination p.puretext {}
.single .main-entry .pagination p.current { background-color: #9ba6b0; color: #fff; border: none; }
.single .main-entry .pagination p.puretext, .single .main-entry .pagination p.current { font-weight: normal; padding: 6px 11px; line-height: normal; margin-right: 1px; border: none; }
.single .main-entry .pagination a {border: none; color: #384047; margin-right: 1px}
.single .main-entry .pagination a:hover {color: #fff}
.single .main-entry .pagination a.fullpostlink {margin-left: 4px; padding: 5px 10px; border: 1px #9ba6b0 solid;}

    @media screen and (min-width: 48em) /* 768+ */ {
        #primary-postlist .pagination { margin-left: 1em}
    }



/* Pages */
.page h1 {}

    #page-sexcam--roomlist h3 {margin-bottom: 1em}
        #page-sexcam--roomlist .metas {border-bottom: 1px solid #657380; margin-bottom: 1em; padding-bottom: .5em}
        #page-sexcam--roomlist h3 a {display: block}


    /* page-contacts */
    .page-contacts #contact-form {background: #657380; margin: 0 auto; margin-bottom: 2em; margin-top:2em; text-align: center; padding: 1em}

    .page-contacts #contact-form form {padding: 0 1em;}

    .page-contacts .pure-control-group {margin-bottom: 1em}

    .page-contacts #contact-form input, .page-contacts #contact-form textarea { background: #fcfcfc; border: none; padding: 1em; width:95%; width:calc(100% - 2em)}
        .page-contacts #contact-form input:focus, .page-contacts #contact-form textarea:focus, .page-contacts #contact-form select:focus { outline: 0; }

    .page-contacts #contact-form label {text-align: left; display:block; font-weight: bold; margin-bottom: .5em; color: #fff;}

    .page-contacts #contact-form select {width: 100%;}

    .page-contacts #contact-form .button {
        border:none;
        display: inline-block;
        font-family: "Roboto Slab", "helvetica neue", helvetica, arial, sans-serif;
        font-size: 1em;
        outline: 0;
        padding: .5em;
        text-align: center;
        text-transform: uppercase;
        text-decoration: none;
        white-space: nowrap;
        width: 100%;
        height: 2.5em;
        background: #fcfcfc;
    }
    .page-contacts #contact-form  .button:hover { background:#9ba6b0; color: #fcfcfc}
    .page-contacts #contact-form  .button:active { position: relative; top: 1px; }
    .page-contacts #contact-form  .button:active, .page-contacts #contact-form .button:focus { }

    .alert {margin: 0 auto 1em; padding: 1em; background: #384047; color:#fff}
        .alert-warning, .alert-danger {color:#f00}
        .alert-success {color:#952067}


/* !ARCHIVES, SEARCH & 404 -- .archive est appliqué au #content de search et error404 */
 #content.archive>section:first-of-type,
.single #content>article.main-article:first-of-type,
.page #content>article.main-article:first-of-type {
    margin-top: 2em
}

.archive h1.post-title {
}
    @media screen and (min-width: 48em) /* 768+ */{
        .archive h1.post-title {
            margin-top: 16px;
        }
    }

.archive #primary-postlist {
    margin-top: 1em
}
    .archive #post-list .primary-postlist-title {
        text-shadow: none;
        margin-top: 1em;
    }

    @media screen and (min-width: 48em) /* 768+ */{
        .archive .main-article {
            margin-left: 1em;
        }
    }

    .archive .main-article h2 {
        margin-bottom: 0;
        font-family: 'Oxygen', Helvetica, Arial, sans-serif;
        text-transform: none;
        text-align: center
    }

        .archive .main-article h3,
        .archive .type2-row h3 {
            border-top: none;
        }
        .archive .main-article h3 {
            margin-top: 0;
            margin-bottom: 2.25em;
            font-family: 'Oxygen', Helvetica, Arial, sans-serif;
            text-transform: none;
            text-align: center
        }


.archive .main-entry a {
    border-bottom:1px #5dadec solid; 
    color: #e75a70
}
.archive .main-entry .img-container a {
    border: none
}

.archive .main-entry a:hover,
.archive .main-entry a:active {
    border-color:#9ba6b0;
    color:#9ba6b0
}

.archive #post-list h2 {
	text-align: center;
	margin-bottom: 1em
}

ul.azchars {
	padding: 0 1em;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-content: flex-start;
	flex-wrap: wrap;
	text-transform: uppercase;
}
ul.azchars li {display: inline-block}

ul.azchars a { font-weight: normal; padding: 6px 10px; line-height: 45px; margin-right: 5px; border: none; }
ul.azchars a:hover, ul.azchars .current { background-color: #9ba6b0; color: #fff; text-decoration: none; }


@media screen and (min-width: 48em) /* 768+ */{

	.archive #post-list h2 {margin-left: .5em}

	ul.azchars {flex-wrap: nowrap;}

	ul.azchars a {padding: 6px 7px;}

}


/* !FOOTER  ============================================================================= */
#footer, #footer .pure-g [class *= "pure-u"] {
    font-family: 'Oxygen', "helvetica neue", helvetica, arial, sans-serif;
}

#footer a:link, #footer a:visited {text-decoration: none; color:#657380;}
#footer a:hover, #footer a:active {color:#9ba6b0;}

#footerfoot {
    color:#fff;
    clear: both;
    width: 80%;
    font-size: 1em;
    max-width: 85em;
    margin: 0 auto;
    position: relative;
    text-align: center
}
    .credits {
        margin: 0;
        padding: 0;
        display: inline-block;
    }
    .credits li {display: inline-block; padding-right: .5em;}

    #footerfoot span {padding-right: .3em}
        #footerfoot span a {white-space: pre}

    .credits li:after, #footerfoot span:after {content: '•'; margin-left:.5em;}
        .credits>li:last-child:after, #footerfoot span:last-child:after {content: none}

#footerfoot li.footer-host:before {content:'Fièrement hébergé par : ';}
#footerfoot li.footer-design:before {content:'Webdesign : ';}



/* !PUBS  ============================================================================= */

.adv {
	margin: 2em auto 1em;
	padding: 1em 0;
    border: 1px #eee solid;
	text-align: center;
	background-color: #fff;
	position: relative;
	display: none;
}
    .adv:first-child {margin-top: 0}

    .adv.adv--inter {
        margin-top: .5em;
        margin-bottom: 1.35em;
    }
    @media screen and (min-width: 48em) {
        .adv.adv--inter {margin-left: 1em}
    }

    .sidebar .adv {
        border-left-width: 0;
        border-right-width: 0;
    }
    @media screen and (min-width: 80em) {
        .sidebar .adv {
            border-left-width: 1px;
            border-right-width: 1px;
        }
    }

    .adv img { width: 100%; height: auto !important; }

    .adv>h3 {text-align: left;}

    .adv .g {width: 100%}

    .adv .g, .adv .g img { line-height: 0 }
    .adv .g a + img, .adv .g iframe + img {width: 1px}

    .adv .g iframe {display: block; margin: auto;}

    .adv .g.g-2 {margin-left: auto; margin-right: auto;} /* Attention g-2 = group 2, donc à voir comment etre plus generique */

.adv:before {
    content: 'Publicité';
    font-size: .6em;
    position: absolute;
    top: -1.7em;
    left: calc(50% - 3.8em);
    background: white;
    padding: 1em;
    color: #ccc;
    font-family: 'Roboto Slab', helvetica, sans-serif;
    text-transform: uppercase;
}

#advEnd a {border: none;}

.home #advCenter {margin-bottom: 0;}

    @media screen and (max-width: 63.9em) {
        .adv.hidden--mobile {display: none!important}
    }


.footer-notif {
    position: fixed;
    z-index: 10000;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #333;
    color: #fff;
    text-shadow: 0 0 2px #555;
    text-align: center;
    box-sizing: border-box;
    padding: 1em;
    display: none;
    transition:none;
}



/* HABILLAGES */
#ads--takeover-wrap {width: 100%; overflow: hidden; position: absolute;}

    body.takeover {background: none}

    .single.takeover article.main-article, .page.takeover #content>section {
        top: 212px; /* = 260px du bandeau - 48px de marge du bloc <article> */
        margin-bottom: 212px;
        background-color: #fff;
        padding: 1em;
    }

    .takeover #ads--takeover-wrap {
        height: 2000px;
        cursor: pointer;
        top: 0;
        left: 0;
        z-index: -1;
        background: #fff;
        /*background: url('http://') center top no-repeat; */ /* background pour les opé sur tout le site */
        background-size: 100%;
    }
        .takeover.postid-xxx  #ads--takeover-wrap {
            background:url('https://') center top no-repeat;
            background-size: 100%;
        }

        @media screen and (min-width: 48em) /* 768+ */ {
            .takeover #ads--takeover-wrap {top: -20px} /* opposite content-wrapper's 'top' value */
        }

        @media screen and (min-width: 64em) /* 1024+ */ {
            .takeover #ads--takeover-wrap {top: 0}
        }

        @media screen and (min-width: 80em) /* 1280+ */ {
            .takeover #ads--takeover-wrap {top: 0}
        }

#header-menu-bar #search {
}

    #header-menu-bar #search form {
        display: inline-flex;
        width: 100%;
        padding: 0 1em;
    }

    #header-menu-bar #search input {
        background: #a4bbcf url(https://twemoji.maxcdn.com/2/svg/1f50d.svg) no-repeat center left;
        background-size: 1em 1em;
        background-position-x: .5em;
        border: 0;
        color: white;
        padding: .5em 1em .5em 2em;
        font-weight: normal;
        font-family: 'Roboto Slab',Helvetica,Arial,sans-serif;
        width: 100%;
        display: block;
    }

        #header-menu-bar #search input:focus {
            outline: none;
            background: #a3b9ce url(https://twemoji.maxcdn.com/2/svg/1f50d.svg) no-repeat center left;
            background-size: 1em 1em;
            background-position-x: .5em;
            border-right: 0;
        }

        #header-menu-bar #search input::placeholder,
        #header-menu-bar #search input::-ms-input-placeholder,
        #header-menu-bar #search input:-ms-input-placeholder{
            color: rgba(187, 187, 187, 0.979);
            opacity: 1;
        }

#header-menu-bar #logo {
    display: none;
}

#nav--best-of h3 {
    padding: 1.05em;
    color: #fff;
}


@media (max-width:425px){
    .home #post-list article div > p { font-size: 0.80em }
}

@media (min-width:980px){
    .pure-visible-phone{display:none}
    .pure-visible-tablet{display:none}
}
@media (max-width:767px){
    .pure-hidden-phone{display:none}
    .pure-visible-desktop{display:none}
}
@media (min-width:768px) and (max-width:979px){
    .pure-hidden-tablet{display:none}
    .pure-visible-desktop{display:none}
}