@charset "UTF-8";
@import url(animations.css);

@font-face {
    font-family: 'DinNextRegular';
    src: url('../fonts/din-next/regular/DinNextRegular.eot');
    src: url('../fonts/din-next/regular/DinNextRegular.eot') format('embedded-opentype'),
    url('../fonts/din-next/regular/DinNextRegular.woff2') format('woff2'),
    url('../fonts/din-next/regular/DinNextRegular.woff') format('woff'),
    url('../fonts/din-next/regular/DinNextRegular.ttf') format('truetype'),
    url('../fonts/din-next/regular/DinNextRegular.svg#DinNextRegular') format('svg');
}

* {

    margin: 0;

    padding: 0;

}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {

    margin: 0;

    padding: 0;

    border: 0;

    font: inherit;

    font-size: 100%;

    vertical-align: baseline;

}

html {

    line-height: 1;

}

a, a:active, a:hover, a:focus {

    text-decoration: none;

}

ol,
ul {

    list-style: none;

}

table {

    border-collapse: collapse;

    border-spacing: 0;

}

caption,
th,
td {

    text-align: left;

    font-weight: normal;

    vertical-align: middle;

}

q,
blockquote {

    quotes: none;

}

q:before,
q:after,
blockquote:before,
blockquote:after {

    content: "";

    content: none;

}

a img {

    border: none;

}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {

    display: block;

}

html {

    font-size: 112.5%;

    line-height: 1.33333em;

}

html {

    overflow-y: auto;

    background-color: #fff;

    -webkit-text-size-adjust: 100%;

    -ms-text-size-adjust: 100%;

}

body {

    height: 100vh;
    text-align: center;

    background: #f3f3f3 url(../img/bg.png) no-repeat 0px 100px;

    font-family: 'Lato', sans-serif;

    font-weight: normal;

}

html,
body,
button,
input,
select,
textarea {

    text-transform: none;

    font-size: 18px;

    font-weight: 300;

    line-height: 26px;

    letter-spacing: 0;

    color: #6b6b6b;

    -webkit-tap-highlight-color: transparent;

    -webkit-font-smoothing: antialiased;

}

html::selection,
body::selection,
button::selection,
input::selection,
select::selection,
textarea::selection {

    color: #fff;

    background: #ee6557;

}

html::-moz-selection,
body::-moz-selection,
button::-moz-selection,
input::-moz-selection,
select::-moz-selection,
textarea::-moz-selection {

    color: #fff;

    background: #16a6b6;

}

.container {

    position: relative;
    right: 0;
    /* top: 100px; */
    margin: 0 auto;
    width: calc(100% - 60px);

    padding: 0;
    z-index: 8;
    float: right;
    /* overflow: auto; */
    background: #f3f3f3 url(../img/bg.png) no-repeat;

}

#outils .container {
    height: 100%;
}

#outils {
    overflow: hidden
}

#home .container {
    background-position: left 70vh;
}

/*#sehati_tv .container {
    height: 65vh
}*/

#article .container,
#theme .container,
#theme,
#thematiques .container {

    overflow: hidden;

}

#article .container, #theme .container {
    height: 100%;
}

#thematiques .container {

    height: auto;

}

#article .container,
#theme .container,
#thematiques .container,
#thematiques .navbar-default,
#theme .navbar-default {

    width: 100%;

}

#theme .side_menu,
#thematiques .side_menu,
#thematiques #search,
#theme #search {

    display: none;

}

#thematiques nav,
#theme nav {

    width: calc(100%);

}

#article .side_menu {

    transform: translateX(-60px);

}

#article .side_menu ul li.gn-trigger > a {

    transform: translate(60px);

}

#article .side_menu .gn-menu-wrapper.gn-open-all {

    transform: translate(60px);

}

#header #search {
    width: 60px;
    height: 100%;
    background-color: #20793c;
    float: left;
}

.post_content .content {

    margin-top: 0;

    position: fixed;

    bottom: 0;

    overflow: hidden;

    height: calc(100vh - 144px) !important;
    width: 100%

}

.side_menu {

    width: 60px;

    height: 100%;

    background-color: #25a642;

    float: left;

    z-index: 9999;

    position: fixed;

    bottom: 0;

}

.side_menu ul li {
    height: 75px;
    width: 100%;
    display: table;
    padding: 10px 8px
}

.side_menu ul li:nth-child(even) {
    background-color: #24a03d
}

.side_menu ul li a {
    display: table-cell;
    vertical-align: middle;
}

.side_menu ul li a svg {
    fill: #19682f;
    display: inline-block;
    vertical-align: middle;
}

.list-hex-grid {

    font-size: 0;

    word-spacing: 1px;

    word-spacing: 0;

    position: relative;

    height: calc(100vh - 100px) !important;

    padding: 0px;

    width: 100%;

    margin: 0;

}

.list-hex-grid.with-labels {

    margin-bottom: 200px;

}

.list-hex-grid img {

    display: inline-block;

    vertical-align: middle;

    vertical-align: top;

    *vertical-align: auto;

    *zoom: 1;

    *display: inline;

}

.list-hex-grid div.hex {

    display: inline-block;

    z-index: 10;

    float: none;

    transition: all 1s;

    position: relative;

    font-size: 16px;

    vertical-align: middle;

    *vertical-align: auto;

    *zoom: 1;

    *display: inline;

    margin: 5px 0;

    width: 100%;

}

.list-hex-grid div.hex.active {

    z-index: 99 !important;

}

.list-hex-grid div.hex > a,
.list-hex-grid div.hex > div {

    height: 110px;

    line-height: 220px;

}

.list-hex-grid div.hex .inner {

    top: -55px;

}

.list-hex-grid div.hex .hex-1:before,
.list-hex-grid div.hex .hex-2:before {

    width: 220px;

    height: 220px;

}

.list-hex-grid div.hex > a,
.list-hex-grid div.hex > div {

    display: block;

    border: none;

    text-align: center;

    position: relative;

    font-size: 18px;

    word-spacing: 1px;

    color: #fff;

    height: 100%;

    background-position: 50% 50%;

    background-repeat: no-repeat;

    background-size: cover;

    -webkit-transition: none 1s;

    -moz-transition: none 1s;

    -o-transition: none 1s;

    transition: none 1s;

    -webkit-backface-visibility: hidden;

    -o-background-size: auto 220px;

    transition: all .5s;

}

.list-hex-grid div.hex p {

    font-size: 16px;

    color: #fff;

}

.list-hex-grid div.hex p.icon {

    position: absolute;

    top: 50%;

    transform: translateY(-50%) translateX(-50%);

    left: 50%;

    right: 0;

    width: 60px;

    display: block;

    height: 60px;

    border-radius: 50%;

    transition: all .5s;

    z-index: 11;

}

.list-hex-grid div.hex.active p.icon {

    width: 100%;

    height: 100%;

    border-radius: 0;

}

.list-hex-grid div.hex.active p.icon svg,
.list-hex-grid div.hex.active p.icon img,
.list-hex-grid div.hex.active h3 {

    opacity: 0;

    visibility: hidden;

}

.list-hex-grid div.hex p.icon svg,
.list-hex-grid div.hex p.icon img {

    opacity: 1;

    visibility: visible;

    width: 50%;

    top: 50%;

    position: relative;

    transform: translateY(-50%);

    fill: #fff;

}

.list-hex-grid div.hex h3 {

    position: absolute;

    left: 0;

    right: 0;

    transform: translateY(300px);

    opacity: 0;

    visibility: hidden;

    transition: all .3s;

    font-weight: bold;

    font-family: "Lato";

    text-align: center;

}

.list-hex-grid div.hex:hover h3 {

    top: 50%;

    transform: translateY(-40%);

    opacity: 1;

    visibility: visible;

    margin-top: 50px;

    z-index: 99;

}

.list-hex-grid div.hex p {

    font-size: 16px;

    color: #fff;

}

.list-hex-grid div.hex p.icon img {

    width: 70%;

}

.list-hex-grid div.hex .inner {

    display: inline-block;

    z-index: 20;

    max-width: 80%;

    text-transform: uppercase;

    font-family: 'Lato', sans-serif;

    font-weight: 300;

    line-height: 22px;

    white-space: normal;

    vertical-align: middle;

    color: #fff !important;

    *vertical-align: auto;

    *zoom: 1;

    *display: inline;

}

.list-hex-grid .hex:after, .list-hex-grid .hex:before {

    /*content: '';*/

    height: 0;

    display: block;

    width: calc(100% - 30px);

    background: transparent;

    box-sizing: border-box;

    position: absolute;

    left: 0;

    margin-left: 15px;

}

.list-hex-grid .hex:before {

    top: -50px;

    border-bottom: 50px solid #2173B5;

    border-left: 78px solid transparent;

    border-right: 77px solid transparent;

}

.list-hex-grid .hex:after {

    bottom: -50px;

    border-top: 50px solid #2173B5;

    border-left: 78px solid transparent;

    border-right: 77px solid transparent;

}

header#header {

    height: 100px;

    width: 100%;

    float: left;

    top: 0;

    z-index: 9;

    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);

}

nav .fonts-display:after {

    clear: both;

    content: '';

    display: block;

}

nav .fonts-display p {

    float: left;

    margin: 0 10px;

    display: block;

    line-height: 130px;

}

nav .fonts-display p a {

    font-size: 16px;

}

.theme_content {

    z-index: 99;

    position: fixed;

    top: 100px;

    bottom: 0;

    width: calc(100%);

    overflow-y: scroll;

    -webkit-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

    transform: translateY(100%);

}

.theme_content.thematique1,
.theme_content.thematique1 .block:after,
.list-hex-grid div.hex.thematique1 > a,
.post_content.thematique1 {

    background: #EE6557;

}

.theme_content.thematique2,
.theme_content.thematique2 .block:after,
.list-hex-grid div.hex.thematique2 > a,
.post_content.thematique2 {

    background: #16A6B6;

}

.theme_content.thematique3,
.theme_content.thematique3 .block:after,
.list-hex-grid div.hex.thematique3 > a,
.post_content.thematique3 {

    background: #2ecc71;

}

.theme_content.thematique4,
.theme_content.thematique4 .block:after,
.list-hex-grid div.hex.thematique4 > a,
.post_content.thematique4 {

    background: #9b59b6;

}

.theme_content.thematique5,
.theme_content.thematique5 .block:after,
.list-hex-grid div.hex.thematique5 > a,
.post_content.thematique5 {

    background: #e67e22;

}

.theme_content.thematique6,
.theme_content.thematique6 .block:after,
.list-hex-grid div.hex.thematique6 > a,
.post_content.thematique6 {

    background: #f1c40f;

}

.theme_content.thematique7,
.theme_content.thematique7 .block:after,
.list-hex-grid div.hex.thematique7 > a,
.post_content.thematique7 {

    background: #EE6557;

}

.theme_content .content {

    width: 90%;

    margin: 0px auto;

    padding-top: 30px;

    float: left;

    position: relative;

    left: 50%;

    transform: translateX(-50%);

}

.theme_content.active {

    animation-name: show_block_content;

    animation-duration: .5s;

    animation-fill-mode: forwards;

    animation-delay: .5s;

}

.theme_content.noactive {

    animation-name: hide_block_content;

    animation-duration: .5s;

    animation-fill-mode: forwards;

}

.theme_content.active .close {

    z-index: 1;

    position: absolute;

    top: 5%;

    right: 5%;

    width: 44px;

    height: 44px;

    border-radius: 50%;

    text-decoration: none;

    -webkit-transition: all .3s;

    transition: all .3s;

    cursor: pointer;

    background: url(../img/thematiques_icons.png);

}

.theme_content.active .close:hover,
.post_content.active .close:hover {

    /* box-shadow: 0 0 0 4px #fff; */

}

.block {

    padding: 20px 20px 30px;

    opacity: 0;

}

.block .colmarg {

    padding: 55px;

    background: url(../img/motif_art.jpg) no-repeat left top #fff;

}

.block p,
.block p * {
    font-family: 'lato' !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    font-size: 0.9em !important;
    text-align: justify !important;
}

.content {

    margin-top: 50px;

}

.block:after {

    content: '';

    display: block;

    z-index: 99999;

    position: absolute;

    bottom: 0;

    left: 0;

    width: 100%;

    height: 2px;

    background: transparent !important;

}

.block.active {

    animation-name: show_posts;

    animation-duration: .5s;

    animation-fill-mode: forwards;

    animation-delay: 0s;

    transform: translateY(100vh);

    opacity: 0;

}

.block.active.diff1 {

    animation-duration: 0.7s;

}

.block.active.diff2 {

    animation-duration: 0.9s;

}

.block.noactive {

    animation-name: hide_posts;

    animation-duration: 1s;

    animation-fill-mode: forwards;

    animation-delay: .1s;

    transform: translateY(0vh);

    opacity: 1;

}

.block.noactive.diff1 {

    animation-delay: .2s;

}

.block.noactive.diff2 {

    animation-delay: .3s;

}

/*

.theme_content.active.loadpost {

    overflow: hidden;

    animation-name: hide_theme;

    animation-duration: .5s;

    animation-fill-mode: forwards;

    animation-delay: 1s;

    transform: translateY(0%);

}



.theme_content.active.noloadpost {

    animation-name: show_theme;

    animation-duration: .5s;

    animation-fill-mode: forwards;

    animation-delay: .3s;



}*/

.post_content {

    z-index: 99;

    position: fixed;

    top: 100px !important;

    bottom: 0;

    left: 0;

    width: 100%;

    overflow: hidden;

    -webkit-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

    visibility: hidden;

    /*transform: translateX(-50%) translateY(0%);*/

}

.post_content.active {

    visibility: visible;

}

.post_content .content > div {

    width: calc(100%);

    top: 0;

    right: 0;

    bottom: 0;

    transition: all .5s;

    float: right;

}

.post_content .content .section .block_text {

    right: 0;

    transform: translateX(100%);

    margin-left: -60px;

    padding: 80px;

    text-align: left;

    height: auto

}

.post_content .content .section .block_image, .bg-icons {

    left: 0;

    transform: translateX(-100%);

    background: #e8e8e8 url(../img/bg-top-right.png) no-repeat right 0 !important;

}

.post_content .content .section:last-child, .post_content .content .section:last-child .block_text {
    min-height: calc(100vh - 144px);
}

.post_content.active .content .section .block_image,
.post_content.active .content .section .block_text, .bg-icons {

    animation-duration: .5s;

    animation-fill-mode: forwards;

    animation-delay: .5s;

}

.post_content.active .content .section .block_text {

    animation-name: show_post_content;

    margin-left: 0;

    overflow-y: auto;

    overflow-x: hidden;

}

.post_content.active .content .section .block_text table td {

    font-size: 90%;

}

.post_content.active .content .section .block_text table td, .post_content.active .content .section .block_text table th {

    background: #fff;

    margin: 1px;

    border: 1px solid #ccc;

}

.post_content.active .content .section .block_text table th {

    background: #ecf0f1;

    padding: 10px;

}

.post_content.active .content .section .block_image, .post_content.active .bg-icons {

    animation-name: show_post_content_img;

}

.post_content.noactive .content .section .block_image,
.post_content.noactive .content .section .block_text,
.post_content.noactive .bg-icons {

    animation-name: hide_post_content;

    animation-duration: .5s;

    animation-fill-mode: forwards;

    animation-delay: 0s;

}

.post_content .content .section .block_text * {
    line-height: 1.4 !important;
}

.home_content {

    position: relative;

    opacity: 0;

}

.home_content.active {

    opacity: 1;

}

.interactive div.hex {

    opacity: 1 !important;

}

.theme_content,
.home_content {

    transition: all .5s;

}

.post_content .block_image svg,
.post_content .block_image img {

    display: inline-block;

    width: 300px;

    max-height: 70%;

    top: 50% !important;

    position: relative;

    transform: translateY(-50%);

    max-width: 100%;

    height: auto;

}

.post_content .block_image .svg.firstsquare,
.post_content .block_image .img.firstsquare {

    margin: auto;

    position: absolute;

    left: 0;

    right: 0;

    top: 0;

    bottom: 0;

    width: 100%;

    height: 100%;

    max-width: 90%;

    max-height: 90%;

    padding: 20px;

    text-align: center;

}

.post_content .block_image .svg.firstsquare svg {

    border: 20px solid #fff;

    padding: 20px;

    -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1);

    -moz-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1);

    box-shadow: 0 0 30px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1);

}

.nobackground {

    background: transparent !important;

}

.nodelay {

    animation-delay: .3s !important;

}

/* 22-12-2015 */

nav {
    background: url(../img/menu_bg.jpg) white no-repeat right;
    width: calc(100% - 60px);
    height: 100px;
    float: right
}

nav ul {
    list-style: none;
    text-align: right;
    margin: 0 0px;
}

nav ul li {
    display: inline-block;
    padding: 10px 15px;
}

nav ul li a {
    font-size: 16px;
    text-transform: uppercase;
    cursor: pointer;
    color: #38403a;
    font-size: 0.8em;
    font-weight: normal;
}

nav ul.first_menu li a {
    color: #686868;
    font-size: 0.7em;
    letter-spacing: 0.6px;
}

a.Ar {
    font-size: 1em !important;
}

#header .logo {
    float: left;
    margin: 10px 0px;
    height: 80px;
}

#header .logo img {

    width: 50%;

    float: left;

}

/* Thematiques Blocks */

.hex.col2_ind0 {

    height: calc(60vh - 65px);

}

.colOf3 .hex {

    height: calc((100vh - 140px) / 3) !important;

}

.colOf2_6_4 .hex:nth-child(1) {

    height: calc(60vh - 65px);

}

.colOf2_6_4 .hex:nth-child(2) {

    height: calc(40vh - 65px);

}

.colOf2_4_6 .hex:nth-child(1) {

    height: calc(40vh - 65px);

}

.colOf2_4_6 .hex:nth-child(2) {

    height: calc(60vh - 65px);

}

.colOf2_5 .hex {

    height: calc(50vh - 65px) !important;

}

.colOf1 .hex {

    height: calc(100vh - 120px);

}

.colOf4 .hex {

    height: calc((100vh - 150px) / 4);

}

/* END */

.sec_numeros .tile-object {
    background: #92b84a
}

/* Start Block Color */

.dossier_mois .block .colmarg.violet,
.hex.violet,
.hex.violet p.icon,
.theme_content.color_violet,
.theme_violet #fp-nav ul li a span,
.theme_violet .post_content .content_menu {

    background: #8252ba;

}

.hex.violet h3,
.theme_violet .post_content .block_text h1,
.theme_violet .post_content .block_text h2 {

    color: #8252ba;

}

/* END Block Color */
/* Start Block Color */

.dossier_mois .block .colmarg.violet_2,
.hex.violet_2,
.hex.violet_2 p.icon,
.theme_content.color_violet_2,
.theme_violet_2 #fp-nav ul li a span,
.theme_violet_2 .post_content .content_menu {

    background: #615FB8;

}

.hex.violet_2 h3,
.theme_violet_2 .post_content .block_text h1,
.theme_violet_2 .post_content .block_text h2 {

    color: #615FB8;

}

/* END Block Color */

/* Start Block Color */

.dossier_mois .block .colmarg.red,
.hex.red,
.sec_numeros .red,
.hex.red p.icon,
.theme_content.color_red,
.theme_red #fp-nav ul li a span,
.theme_red .post_content .content_menu {

    background: #b84a73;

}

.hex.red h3,
.theme_red .post_content .block_text h1 {

    color: #b84a73;

}

/* END Block Color */

/* Start Block Color */

.dossier_mois .block .colmarg.vert,
.hex.vert,
.sec_numeros .vert,
.hex.vert p.icon,
.theme_content.color_vert,
.theme_vert #fp-nav ul li a span,
.theme_vert .post_content .content_menu {

    background: #a4b113;

}

.hex.vert h3,
.theme_vert .post_content .block_text h1 {

    color: #a4b113;

}

/* END Block Color */
/* Start Block Color */

.dossier_mois .block .colmarg.vert_2,
.hex.vert_2,
.sec_numeros .vert_2,
.hex.vert_2 p.icon,
.theme_content.color_vert_2,
.theme_vert_2 #fp-nav ul li a span,
.theme_vert_2 .post_content .content_menu {

    background: #92b84a;

}

.hex.vert_2 h3,
.theme_vert_2 .post_content .block_text h1 {

    color: #92b84a;

}

/* END Block Color */
/* Start Block Color */

.dossier_mois .block .colmarg.vert_3,
.hex.vert_3,
.sec_numeros .vert_3,
.hex.vert_3 p.icon,
.theme_content.color_vert_3,
.theme_vert_3 #fp-nav ul li a span,
.theme_vert_3 .post_content .content_menu {

    background: #b2bc3f;

}

.hex.vert_3 h3,
.theme_vert_3 .post_content .block_text h1 {

    color: #b2bc3f;

}

/* END Block Color */
/* Start Block Color */

.dossier_mois .block .colmarg.rouge,
.hex.rouge,
.sec_numeros .rouge,
.hex.rouge p.icon,
.theme_content.color_rouge,
.theme_rouge #fp-nav ul li a span,
.theme_rouge .post_content .content_menu {

    background: #b84a73;

}

.hex.rouge h3,
.theme_rouge .post_content .block_text h1 {

    color: #b84a73;

}

/* END Block Color */

/* Start Block Color */

.dossier_mois .block .colmarg.bleu-fonce,
.hex.bleu-fonce,
.sec_numeros .bleu-fonce,
.hex.bleu-fonce p.icon,
.theme_content.color_bleu-fonce,
.theme_bleu-fonce #fp-nav ul li a span,
.theme_bleu-fonce .post_content .content_menu {

    background: #4a6eb8;

}

.hex.bleu-fonce h3,
.theme_bleu-fonce .post_content .block_text h1 {

    color: #4a6eb8;

}

/* END Block Color */
/* Start Block Color */

.dossier_mois .block .colmarg.bleu_2,
.hex.bleu_2,
.sec_numeros .bleu_2,
.hex.bleu_2 p.icon,
.theme_content.color_bleu_2,
.theme_bleu_2 #fp-nav ul li a span,
.theme_bleu_2 .post_content .content_menu {

    background: #1496b6;

}

.hex.bleu_2 h3,
.theme_bleu_2 .post_content .block_text h1 {

    color: #1496b6;

}

/* END Block Color */

/* Start Block Color */
.dossier_mois .block .colmarg.rouge_2,
.hex.rouge_2,
.sec_numeros .rouge_2,
.hex.rouge_2 p.icon,
.theme_content.color_rouge_2,
.theme_rouge_2 #fp-nav ul li a span,
.theme_rouge_2 .post_content .content_menu {

    background: #e8484c;

}

.hex.rouge_2 h3,
.theme_rouge_2 .post_content .block_text h1 {

    color: #e8484c;

}

/* END Block Color */

/* Start Block Color */
.dossier_mois .block .colmarg.jaune_2,
.hex.jaune_2,
.sec_numeros .jaune_2,
.hex.jaune_2 p.icon,
.theme_content.color_jaune_2,
.theme_jaune_2 #fp-nav ul li a span,
.theme_jaune_2 .post_content .content_menu {

    background: #ebb231;

}

.hex.jaune_2 h3,
.theme_jaune_2 .post_content .block_text h1 {

    color: #ebb231;

}

/* END Block Color */
/* Start Block Color */

.dossier_mois .block .colmarg.jaune,
.hex.jaune,
.sec_numeros .jaune,
.hex.jaune p.icon,
.theme_content.color_jaune,
.theme_jaune #fp-nav ul li a span,
.theme_jaune .post_content .content_menu {

    background: #D8A936;

}

.hex.jaune h3,
.theme_jaune .post_content .block_text h1 {
    color: #D8A936;
}

/* END Block Color */
/* Start Block Color */

.dossier_mois .block .colmarg.gris,
.hex.gris,
.sec_numeros .gris,
.hex.gris p.icon,
.theme_content.color_gris,
.theme_gris #fp-nav ul li a span,
.theme_gris .post_content .content_menu {

    background: #7EA9B8;

}

.hex.gris h3,
.theme_gris .post_content .block_text h1 {
    color: #7EA9B8;
}

/* END Block Color */

/* Start Block Color */

.dossier_mois .block .colmarg.marron,
.hex.marron,
.sec_numeros .marron,
.hex.marron p.icon,
.theme_content.color_marron,
.theme_marron #fp-nav ul li a span,
.theme_marron .post_content .content_menu {

    background: #99583D;

}

.hex.marron h3,
.theme_marron .post_content .block_text h1 {

    color: #99583D;

}

/* END Block Color */
/* Start Block Color */

.dossier_mois .block .colmarg.orange,
.hex.orange,
.sec_numeros .orange,
.hex.orange p.icon,
.theme_content.color_orange,
.theme_orange #fp-nav ul li a span,
.theme_orange .post_content .content_menu {

    background: #c57845;

}

.hex.orange h3,
.theme_orange .post_content .block_text h1 {

    color: #c57845;

}

/* END Block Color */

/* Start Block Color */

.dossier_mois .block .colmarg.bleu,
.hex.bleu,
.sec_numeros .bleu,
.hex.bleu p.icon,
.theme_content.color_bleu,
.theme_bleu #fp-nav ul li a span,
.theme_bleu .post_content .content_menu {

    background: #2eb2c2;

}

.hex.bleu h3,
.theme_bleu .post_content .block_text h1 {

    color: #2eb2c2;

}

/* END Block Color */

/* Start Block Color */

.dossier_mois .block .colmarg.green,
.hex.green,
.sec_numeros .green,
.hex.green p.icon,
.theme_content.color_nutrition,
.theme_green #fp-nav ul li a span,
.theme_green .post_content .content_menu {

    background: #92b84a;

}

.hex.green h3,
.theme_green .post_content .block_text h1 {

    color: #92b84a;

}

.sec_numeros .white {
    background: white;
    color: #3c62a0
}

/* END Block Color */

.theme_infos {

    float: left;

    width: 100%;

    margin-top: 20px;

}

.theme_infos p.icon {

    width: 50px;

    margin: 0 auto;

    display: block;

    color: #fff;

    margin-bottom: 15px;

}

svg {

    fill: currentColor;

}

.theme_infos p.sous_titre {

    color: #fff;

    font-family: "Lato";

    font-size: 17px;

    margin-bottom: 10px;

}

.theme_infos h1 {

    color: #fff;

    font-family: "Lato";

    font-size: 26px;

    text-align: center;

}

.post_content .content > div .section .block_text,
.post_content .content > div .section .block_image {

    position: absolute;

    background: #fff;

    top: 0;

    bottom: 0;

    transition: all .5s;

}

.post_content .content > div .section .block_text {

    width: calc(65%);

}

.post_content .content > div .section .block_image {

    width: calc(35%);

}

#fp-nav {

    -moz-border-radius: 3px;

    -webkit-border-radius: 3px;

    border-radius: 3px;

    -moz-background-clip: padding;

    -webkit-background-clip: padding-box;

    background-clip: padding-box;

    background-color: #fff;

    padding: 10px 5px;

}

.hex #mere_enfant {
    background-image: url(../img/mere-enfant-original-small.jpg);
}

.hex #vaccination {
    background-image: url(../img/vaccination-original-small.jpg);
}

.hex #vie_saine {
    background-image: url(../img/viesaine-spory-original-small.jpg);
}

.hex #jeune_ado {
    background-image: url(../img/jeune-ado-original-small.jpg);
}

.hex #citoyennete {
    background-image: url(../img/citoyennete-original-small.jpg);
}

.hex #nutrition {
    background-image: url(../img/nutrition-original-small.jpg);
}

.hex #hygiene {
    background-image: url(../img/hygiene-original-small.jpg);
}

.hex a:after {

    content: '';

    display: block;

    width: 100%;

    height: 100%;

    background: rgba(255, 255, 255, .8);

    bottom: 0;

    position: absolute;

    transition: all .5s;

}

.hex:hover a:after {

    height: 50%;

}

.block.blanc .colmarg {

    padding: 55px;

    background: #fff url(../img/bg.png) no-repeat 0px;

}

.block .colmarg h3 {

    font-family: 'lato';

    font-weight: 500;

    font-size: 1.2em;

    margin-bottom: 20px;

    text-align: left;

}

/*.block.blanc*/
.colmarg a {

    color: #635d5d;

    font-family: "Lato";

    font-size: 18px;

    cursor: pointer;

}

.colmarg > a > p > span {
    color: #635d5d !important;
}

.block.color .colmarg {

    padding: 40px;

    background: rgba(0, 0, 0, .3);

}

.block.image .colmarg > a {

    display: block;

    position: relative;

    /* min-height: 300px;*/

}

.block.color .colmarg a {

    color: #fff;

    font-family: "Lato";

    font-size: 18px;

}

.block.image .colmarg img {

    width: 100%;

    display: block;

}

.block.image .colmarg h3 {

    position: absolute;

    bottom: 20px;

    right: 5%;

    color: #fff;

    font-family: "Lato";

    font-size: 1.1em;

    width: calc(100% - 50px);

    transform: translateY(-15px);

    z-index: 3;

    padding-left: 45px;

    margin-bottom: 0;

}

.block.image .colmarg .icon {

    position: absolute;
    bottom: 35px;
    left: 7%;
    z-index: 3;
    width: 40px;
    height: 40px;

}

.block.image .colmarg > a:after {

    content: '';

    display: block;

    height: 220px;

    max-height: 100%;

    position: absolute;

    z-index: 2;

    background: url(../img/gradient.png) repeat-x left bottom;

    width: 100%;

    bottom: 0;
    opacity: 0.7;

}
.infos_jour > a:after {
    content: '';
    display: block;
    height: 100%;
    max-height: 100%;
    position: absolute;
    z-index: 2;
    background: rgba(0,0,0,0.48);
    width: 100%;
    bottom: 0;
    opacity: 0.7;
    left: 0;
}

.block.image .colmarg .noclick .icon,
.block.image .colmarg .blank .icon {

    display: none;

}

.content_menu {

    width: 100%;

    height: 44px;

    background-color: #407fbf;

    color: #fff;

    position: fixed;

    transform: translateY(-44px);

    transition: all .5s;

}

.post_content.active .content_menu {

    transform: translateY(0);

}

.content_menu .theme_title {

    float: left;

}

.content_menu .theme_title h3 {

    line-height: 44px;

    padding: 0 20px;

    border-right: 1px solid #fff;

    line-height: 44px;

    color: #fff;

    font-size: 0.8em;

    font-family: 'raleway';

    font-weight: 500;

}

.content_menu .navigation {

    float: right;

}

.bottom_menu .navigation li,
.content_menu .navigation li {

    float: left;

    height: 100%;

    padding: 0 10px;

    border-left: 1px solid #fff;

}

.bottom_menu .navigation li a,
.content_menu .navigation li a {

    line-height: 44px;

    color: #fff;

}

.bottom_menu .navigation li a span,
.content_menu .navigation li a span {

    margin: 0 10px;

}

.bottom_menu {

    height: 44px;

    background-color: #49494a;

    position: fixed;

    bottom: 0;

    right: 0;

    z-index: 9;

}

.post_content .fp-tableCell {

    height: 100% !important;

}

.post_content .fp-section.fp-table {

    height: 100% !important;

}

.post_content .block_text h1 {

    color: #2f7bc9;

    font-family: "Raleway", sans serif;

    font-size: 1.2em;

    font-weight: 500;

    max-width: 100%;

    margin-bottom: 20px;

    padding-bottom: 10px;

}

.post_content .block_text h1::after {

    content: '';

    width: 95%;

    height: 1px;

    background-color: #f3f1f1;

    position: relative;

    margin: 20px 0;

    display: block;

}

.post_content .block_text p {

    width: 100%;

    color: #3f4041;

    font-family: 'raleway', sans-serif;

    font-size: 1em !important;
    width: auto !important;

    /*font-weight:normal;*/

}

.post_content .block_text span,
.theme_content .content .colmarg a span {
    font-size: 1em !important;
    font-family: 'lato', sans serif !important;
}

.post_content .block_text h4 {

    font-weight: 500;

    margin: 20px 0;

    font-size: 1em;

}

.post_content .block_text blockquote {

    color: #7d858e;

    font-family: "Raleway";

    font-size: 16px;

    font-weight: 500;

}

.post_content .block_text blockquote {

    quotes: "" " " "" "'" "'";

}

.post_content .block_text blockquote:before {

    content: open-quote;

    font-size: 34px;

}

.post_content .block_text blockquote:after {

    content: close-quote;

    font-size: 34px;

}

.post_content .block_text p,
.post_content .block_text blockquote {

    margin-bottom: 10px;

}

.post_content .block_text p img {

    max-width: 100%;

}

#ar_related {

    bottom: 0;
    z-index: 3;

    right: 0px;

    position: fixed;

    transform: translateY(100%);

    width: 35%;
    height: auto;
    transition: all ease 0.8s;

    background: #49494A;

    transition: all .3s;

    padding: 20px;

    -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1);

    box-shadow: 0 0 30px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1);

}

#ar_related.active {

    transform: translateY(0%);

}

#ar_related li {

    margin: 40px;

    text-align: left;

}

#ar_related li a {

    color: #fff;

}

.theme_content.sticked {

    animation-name: none !important;

    transform: translateY(0) !important;

}

#ar_related ul li span {

    font-weight: 500;

    font-family: 'Raleway', sans serif;

    background: url(../img/readMore.png) no-repeat left 3px;

    padding-left: 35px;

    display: block;

    background-size: 18px;

}

#ar_related ul li p {

    font-size: 16px;

    line-height: 1.5;

    margin: 10px 0;

}

.post_content .block_text ul {
    list-style: disc;
    list-style-position: inside;
}

.post_content .block_text ul li {
    margin: 10px 0
}

.bottom_menu .navigation li:first-child {
    border-left: none;
}

.bottom_menu .navigation li:nth-child(2) {
    padding: 0 5px
}

.post_content .block_text h2 {

    font-size: 1.1em;

    font-weight: 500;

    margin: 10px 0;

    font-family: 'raleway', sans serif;

    opacity: 0.8;

}

.post_content .block_text h3 {

    font-weight: 400;

    margin: 20px 0;

    font-size: 1.1em;

    opacity: 0.8;
    width: 100% !important;

}

.theme_hygiene .post_content .block_text h2 {
    color: #2EB2C2;

}

.content_menu .navigation li a {

    background-size: 18px;

    font-weight: 500;

    font-family: 'raleway', sans sans-serif;

    font-size: 0.9em;
}

.content_menu .navigation li:nth-child(1) a {
    background: url(../img/readMore2.png) no-repeat left;

    background-size: 18px;

    padding-left: 15px;
}

.content_menu .navigation li:nth-child(2) a {
    background: url(../img/readMore.png) no-repeat right;

    background-size: 18px;

    padding-right: 15px;
}

.bottom_menu .navigation li a {

    font-size: 0.8em;

    font-family: 'raleway';

    font-weight: 500;
}

.post_content th, td {

    padding: 5px;

    /* border: 1px solid rgba(139,139,139,.2);*/

}

#header .logo img {

    width: 50%;

    float: left;

}

.navbar-nav {

    position: absolute;

    top: 0;

    right: 0;

}

.navbar-nav.navbar-right {

    top: 50px;

    right: 15px;

}

#header ul li {

    margin: 0px 8px;

    margin: 0;

    padding: 0;

}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {

    color: #555;

    background-color: transparent;

    border-bottom: 2px solid #52A92C;

}

.navbar-default {

    background-color: #fff;

}

@media (max-width: 990px) {

    .navbar-header {

        float: none;

    }

    .navbar-toggle {

        display: none;

    }

    .navbar-collapse {

        border-top: 1px solid transparent;

        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);

    }

    .navbar-collapse.collapse {

        display: none !important;

    }

    .navbar-collapse.collapse {

    }

    .navbar-nav {

        float: none !important;

        margin: 7.5px -15px;

    }

    .navbar-nav > li {

        float: none;

    }

    .navbar-nav > li > a {

        padding-top: 10px;

        padding-bottom: 10px;

    }

}

.navbar-collapse.collapse {

    display: block !important;

}

.navbar-nav > li, .navbar-nav {

    float: left !important;

}

.navbar-nav.navbar-right:last-child {

    margin-right: -15px !important;

}

.navbar-right {

    float: right !important;

}

.navbar-default {

    background-color: #fff;

    border-color: #e7e7e7;

    width: calc(100% - 60px);

    float: right;

}

.sec_numeros .nopadding > div {

    padding: 0 !important;

}

.santejeunes div img {

    width: 100%;

}

.sec_numeros .nopadding {

    max-width: 974px;

    margin: 0 auto;

}

.sec_numeros .nopadding > div > div {

    padding: 5px;
    color: white;
    height: 19.20vw;
    max-height: 253px;
    overflow: hidden

}

.noscroll {

    overflow: hidden;

}

/*

.theme_content {

    z-index: 99;

    position: fixed;

    top: 100px;

    bottom: 0;

    left: 50%;

    width: 100%;

    overflow-y: scroll;

    -webkit-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

    transform: translateX(-50%) translateY(100%);

}

.theme_content.thematique1,

.list-hex-grid div.hex.thematique1 > a,

.post_content.thematique1{

    background: #EE6557;

}

.theme_content.thematique2,

.list-hex-grid div.hex.thematique2 > a,

.post_content.thematique2{

    background: #16A6B6;

}

.theme_content.thematique3,

.list-hex-grid div.hex.thematique3 > a,

.post_content.thematique3{

    background: #2ecc71;

}

.theme_content.thematique4,

.list-hex-grid div.hex.thematique4 > a,

.post_content.thematique4{

    background: #9b59b6;

}

.theme_content.thematique5,

.list-hex-grid div.hex.thematique5 > a,

.post_content.thematique5{

    background: #e67e22;

}

.theme_content.thematique6,

.list-hex-grid div.hex.thematique6 > a,

.post_content.thematique6{

    background: #f1c40f;

}

.theme_content.thematique7,

.list-hex-grid div.hex.thematique7 > a,

.post_content.thematique7{

    background: #EE6557;

}



.theme_content .content {

    width: 90%;

    margin-top: 50px;

    margin: 0px auto;

    padding-top: 50px;

}



.theme_content.active {

    animation-name: show_block_content;

    animation-duration: .5s;

    animation-fill-mode: forwards;

    animation-delay: .5s;

}

.theme_content.noactive {

    animation-name: hide_block_content;

    animation-duration: .5s;

    animation-fill-mode: forwards;

}



.theme_content.active .close,

.post_content.active .close {

    z-index: 1;

    position: absolute;

    top: 10px;

    right: 10px;

    width: 30px;

    height: 30px;

    border: 1px solid #2c3e50;

    border-radius: 30px;

    text-decoration: none;

    -webkit-transition: all .3s;

    transition: all .3s;

    cursor: pointer;

}



.theme_content.active .close:hover,

.post_content.active .close:hover {

    border: 1px solid transparent;

    box-shadow: 0 0 0 4px #2c3e50;

    -webkit-transform: rotate(180deg);

    transform: rotate(180deg);

}

.close:after,

.close:before {

    content: '';

    display: block;

    position: absolute;

    top: 0;

    right: 0;

    left: -1px;

    width: 2PX;

    height: 15px;

    margin: 0 14px;

    margin-top: 7px;

    transform: rotate(-45deg);

    background: #2c3e50;

}



.close:before {

    transform: rotate(45deg);

}*/

#home, #home-v1 {
    background: #eee;
}

.slice {

    padding: 10px;

    opacity: 0;

}

.slice .colmarg {

    padding: 10px;

    background: #fff;

}

.slice p {

    text-align: left;

}

.content {

    margin-top: 50px;

}

.content:after {

    content: '';

    display: block;

    clear: both;

}

.slice:before {

    content: '';

    display: block;

    z-index: 3;

    position: absolute;

    top: 0;

    right: -1px;

    left: -1px;

    height: 5px;

    padding: 0;

}

.slice.presentation:before,
.post_content.presentation {

    background: #27702c;

}

.slice.thematiques:before,
.post_content.thematiques {

    background: #369a4b;

}

.slice.connection:before,
.post_content.connection {

    background: #27ba62;

}

.slice.active:before {

    transition: all .5s;

    top: -60vh;

    height: calc(60vh + 5px);

    left: 0;

}

.slice.loadpost:before {

    left: 0;

    width: 100vw;

    transform: translateX(0);

    height: calc(100vh - 100px);

    z-index: 9;

    position: absolute;

    top: -60vh;

    left: 0;

    left: 100%;

    transform: translateX(-100%);

    margin-left: 1px;

}

.slice.loadpost.thematiques:before {

    left: 200%;

    margin-left: 5px;

}

.slice.loadpost.presentation:before {

    left: 300%;

    margin-left: 5px;

}

.parcours p {
    color: white;
    margin: 10px 70px;
    font-size: 0.9em;
}

.slice.loadpost .parcours li.diff1 {

    transition: all .8s;

}

.slice.loadpost .parcours li.diff2 {

    transition: all .6s;

}

.slice.loadpost .parcours li.diff3 {

    transition: all .4s;

}

.slice.loadpost .parcours li.diff4 {

    transition: all .2s;

}

.slice.loadpost .parcours li {

    transform: translateY(600px);

}

.slice.noactive {

    animation-name: hide_cat;

    animation-duration: 1s;

    animation-fill-mode: forwards;

    animation-delay: .1s;

    opacity: 1;

}

.slice.noactive.diff1 {

    animation-delay: .2s;

}

.slice.noactive.diff2 {

    animation-delay: .3s;

}

@keyframes show_cat {

0
{

}

100
%
{

    top: -400px
;

    height: 405px
;

}

}

@keyframes hide_cat {

0
{

}

100
%
{

    top: 0px
;

    height: 5px
;

}

}

@keyframes load_post {

0
{

    position: fixed
;

}

100
%
{

    position: fixed
;

    top: 154px
;

    height: calc(100vh - 154px)
;

    width: 100vw
;

    z-index: 4
;

    bottom: 0
;

}

}

@keyframes hide_post {

0
{

}

100
%
{

    top: 0px
;

    height: 5px
;

}

}

/*

@keyframes show_post_content{

    from{

    }

    to{

        transform: translateX(0%);

    }

}

@keyframes hide_post_content{

    from{

        transform: translateX(0%);

    }

    to{

        transform: auto;

    }

}

@keyframes hide_post_content_text{

    from{

        transform: translateX(0%);

    }

    to{

        transform: translateX(100%);

    }

}



*/

.home_content {

    opacity: 0;

}

.home_content.active {

    opacity: 1;

}

.interactive div.hex {

    opacity: 1 !important;

}

.theme_content,
.home_content {

    transition: all .5s;

}

.post_content .block_image img {

    border: 20px solid #fff;

    -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1);

    box-shadow: 0 0 30px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1);

    display: block;

    margin: 0 auto;

    width: auto;

  /*  padding: 20px;*/

}

.nobackground {

    background: transparent !important;

}

.nodelay {

    animation-delay: 0s !important;

}

#slider_home {

    position: relative; /* can either be relative, absolute or fixed. If position is not set (i.e. static), it would be set to "relative" by script */

    overflow: hidden; /* to bound the empty top space created by inner element's top margin */

    width: 100%;

    min-height: 60vh;

    background-color: #DADADA;

}

.act-inner-content {

    position: absolute;

    z-index: 3;

    padding: 30px;

    bottom: 20px;

    left: 0;

    text-align: center;

    margin: 0 auto;

    right: 0;

}

.act-inner-content h2 {

    color: #fff;

    line-height: 1.2;

    font-size: 1.2em;

    letter-spacing: 0px;

    font-family: 'Raleway', sans serif;
    width: 70%;
    margin: 0 auto;

}

.blocks_cat {

    border-bottom: 1px solid #f3f3f0;

    height: 100px;

}

/*.blocks_cat:after{

    content: '';

    clear: both;

    display: block;

}*/

.blocks_cat .slice {

    display: block;

    border-right: 1px solid #f3f3f0;

    opacity: 1;

    min-height: 100px;

    background-color: #fff;

    border-bottom: 1px solid rgba(210, 210, 210, .2);

}

.blocks_cat .slice:nth-child(2) {

    border-left: 1px solid #D2D2D2;

    border-right: 1px solid #D2D2D2;

}

.blocks_cat .slice:first-child {

    border-left: 1px solid #f3f3f0;

}

.blocks_cat .slice a {

    display: block;

    padding: 15px 10px 0;

}

.blocks_cat .slice ul li a {
    padding-top: 0
}

.blocks_cat .slice a h3 {

    color: #38403a;

    text-transform: uppercase;

    max-width: 80%;

    margin: 0 auto;

    font-weight: 500;

}

.blocks_cat .slice a span {

    color: #a1a2a1;

}

.zs-enabled .zs-slideshow .zs-bullets {

    display: none;

}

.blocks_cat .parcours {

    display: block;

    height: 400px;

    width: 100%;

    position: absolute;

    top: -50vh;

    left: 0;

    z-index: 4;

    opacity: 0;

    visibility: hidden;

}

.blocks_cat .parcours a {
    color: #fff;
    font-weight: 500;
    font-family: "Raleway", sans serif;
    font-size: 0.8em;
}

.blocks_cat .slice.active .parcours {

    opacity: 1;

    visibility: visible;

}

.blocks_cat .slice .parcours h4 {

    color: white;

    font-size: 18px;

    font-weight: 500;

    font-family: "Raleway", sans serif;

}

.parcours ul {

    top: 0;

    position: relative;
    display: table-cell;
    vertical-align: middle;

}

.parcours ul li {

    color: #fff;

    font-size: 18px;

    padding: 10px;

    position: relative;

}

.parcours ul li a {

    color: #fff;

}

.parcours ul li.title {

    color: #fff;

    font-family: "Raleway";

    font-size: 24px;

    margin-bottom: 30px;

}

.parcours ul li.title:after,
.parcours ul li.title:before {

    display: none;

}

.parcours ul li:after {

    content: '';

    width: 60%;

    display: block;

    height: 2px;

    opacity: .27;

    background-color: #fff;

    margin: 0 auto;

    position: absolute;

    bottom: 0;

    left: 0;

    right: 0;

}

.parcours ul li:before {

    content: "\e013";

    position: relative;

    top: 1px;

    display: inline-block;

    font-family: 'Glyphicons Halflings';

    font-style: normal;

    font-weight: 400;

    line-height: 1;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

    left: 20%;

    position: absolute;

    bottom: 0;

    line-height: 46px;

}

#act_slider .infos_top span {

    color: #fff;

    font-family: "Raleway";

    font-size: 15px;

    float: left;

}

#act_slider .infos_top span.date {

    color: #fff;

    font-family: "Raleway";

    font-size: 13px;

    float: right;

}

#act_slider .infos_top:after {

    content: '';

    display: block;

    clear: both;

}

#act_slider .infos_top {

    padding-bottom: 20px;

    margin-bottom: 20px;

    border-bottom: 1px solid #3f4137;

}

#act_slider .body .text {

    color: #fff;

    font-family: "Raleway";

    font-size: 15px;

    float: left;

    text-align: left;

}

#act_slider .body a.read_more {

    background-color: #3f4137;

    color: #fff;

    font-family: "Raleway";

    font-size: 13px;

    text-decoration: none;

    padding: 0 10px;

    height: 35px;

    margin-top: 20px;

    display: block;

    float: left;

    line-height: 35px

}

.lSSlideOuter.vertical .lSAction > .lSNext,
.lSSlideOuter.vertical .lSAction > .lSPrev {

    width: 95px;

    height: 27px;

    background-color: #3e4137;

}

.lSSlideOuter.vertical .lSAction > .lSPrev {

    margin-left: 0px !important;

}

.lSSlideOuter.vertical .lSAction > .lSNext {

    margin-left: -40% !important;

}

.lSSlideOuter.vertical .lSAction > .lSPrev {

    bottom: 10px !important;

    top: auto !important;

}

.lSSlideOuter.vertical .lSAction > .lSPrev:after,
.lSSlideOuter.vertical .lSAction > .lSNext:after {

    content: '<';

    color: #fff;

    font-family: "Raleway";

    font-size: 30px;

    transform: rotate(90deg);

    position: relative;

    display: block;

}

.lSSlideOuter.vertical .lSAction > .lSNext:after {

    transform: rotate(-90deg);

}

.lSPager {

    display: none;

}

section.outils_sec, section.dossier_mois {
    width: 95%;
    margin: 0 auto;
    padding: 50px 0
}

section.dossier_mois.accueil_article {
    padding: 10px 0
}

section.outils_sec h2, section.dossier_mois h2 {
    color: #64943a;
    font-size: 1.4em;
    line-height: 2;
}

section.outils_sec h2::after, section.dossier_mois h2::after {
    content: '';

    width: 40px;

    height: 1px;

    background-color: #649662;

    position: relative;

    margin: 3px auto;

    display: block;
}

.outils_sec .outil_bloc {
    height: 250px;
    display: inline-block;
    padding: 20px 10px;
}

.outils_sec .outil_bloc .inner_txt {
    background-color: #fff;
    width: 100%;
    height: 100%;
}

.block.image .colmarg {

    padding: 0 !important;

    bottom: 5%;

    left: 5%;

}

.dossier_mois .block .colmarg {
    padding: 55px;
    text-align: left;
}

.dossier_mois .block .colmarg[data-color='yellow'] {

    background: #fbbb06;

}

.dossier_mois .block .colmarg[data-color='mere_enfant'] {

    background: #8252ba;

}

.dossier_mois .block .colmarg[data-color='mere_enfant'] > span {

    background: url(../img/themes-icons/theme_mere_enfant_2.png) no-repeat left;
    background-size: 38px;

}

.dossier_mois .block .colmarg[data-color='blue'] {

    background: #2eb2c2;

    padding: 25px 50px;

}

.dossier_mois .block .colmarg[data-color='blue'] > span {

    background: url(../img/icon-hygiene.png) no-repeat left;

}

.dossier_mois .block .colmarg[data-color='red'] {

    background: #b63b69;

    padding: 25px 50px;

}

.dossier_mois .block .colmarg[data-color='red'] > span {

    background: url(../img/icon-vaccin.png) no-repeat left;

}

.dossier_mois .block .colmarg[data-color='green'] > span {

    background: url(../img/icon-vie_saine.png) no-repeat left;

}

.dossier_mois .block .colmarg[data-color='green'] {

    background: #acc719;

    padding: 25px 56px;

}

.block .colmarg[data-has='color'],
.block.color .colmarg {

    color: white;

}

.block .colmarg[data-has='color'] > span,
.block.color .colmarg > span {

    padding-left: 45px;

    line-height: 3;

    display: block;

    height: 50px;

    font-size: 16px;

    margin-bottom: 20px;

}

.block .colmarg[data-has='color'] a,
.block.color .colmarg a {

    color: white;

    cursor: pointer;

}

.block .colmarg[data-has='bg'],
.block.blanc .colmarg {

    background: url(../img/motif_art.jpg) no-repeat left top #fff;

}

.block .colmarg[data-has='bg'] a.readMore,
.block.blanc .colmarg a.readMore {

    background: url(../img/readMoreGrey.png) no-repeat right;
    background-size: 18px;
    margin-top: 20px;
    padding-right: 25px;
    display: inline-block;
    cursor: pointer;

}

.block .colmarg[data-has='image'] {

    position: relative;

    overflow: hidden;

    padding: 0;

}

.block .colmarg[data-has='image'] img {

    width: 100%;

}

.block .colmarg[data-has='image'] h3 {

    position: absolute;

    bottom: 0;

    margin: 30px 50px;

    color: white;

    padding-left: 40px

}

/*************************************3éme piste***************************************************/

#home-v2 .container {
    overflow-y: auto
}

.la-une {

    background-color: #fff;

    /*background-image: url(../img/bg.png);*/

    background-repeat: no-repeat;

    background-position: 0px 100px;

    width: 98%;

    margin: 0 auto;

}

.c_la-une {

    background-color: #fff;

    width: 86%;

    margin: 0 auto;

}

h3.title-actu {

    color: #26a742;

    font-weight: 400;

    font-size: 1.3vw;

    padding: 5vh 0 3vh;

}

.sep-actu {

    border-right: 2px solid #dbdada;

    border-left: 2px solid #dbdada;

}

.clear {

    clear: both;

}

.carousel {
    padding-bottom: 70px;
    padding-top: 50px;
}

.carousel-control.left, .carousel-control.right {
    background-image: none;
}

.carousel-control {
    color: #c2c2c2;
    width: 5%;
    text-shadow: none;
}

.carousel-control:hover {
    color: #c2c2c2;
    width: 5%;
}

.sec_conex, .sec_themes, .sec_portail, .la-une, .footer, .sec_numeros {
    width: 95%;
    margin: 0 auto;
    padding: 30px 20px;
}

.sec_conex {
    background: url(../img/cn_bg.jpg) no-repeat right top #26a743;
    color: white
}

.sec_conex h3 {
    text-transform: uppercase;
    font-size: 1.2em;
    font-family: 'raleway', sans serif;
    line-height: 2;
}

.sec_conex p {
    color: #125c23;
}

.sec_conex > div {
    text-align: center;
    width: 60%;
    margin: 30px auto;
}

.sec_conex > div > a {
    padding-top: 100px;
    display: block;
    cursor: pointer;
    color: white
}

.sec_conex > div > a.cn_facebook {
    background: url(../img/cn_facebook.png) no-repeat top;
}

.sec_conex > div > a.cn_mobile {
    background: url(../img/cn_mobile.png) no-repeat top;
}

.sec_conex > div > a.cn_newsletter {
    background: url(../img/cn_newsletter.png) no-repeat top;
}

.sec_themes {
    background-color: #fff;
}

.sec_themes > p > span {
    color: #64943a;
    font-weight: bold;
}

.slice_theme {
    padding: 0 2%;
}

.slice_theme .img {
    border-radius: 50%;
    width: 60px;
    height: 60px;
    padding: 8px;
    border: 4px solid white;
    margin: 5px auto;
}

.slice_theme .img img {
    width: 100%;
}

.slice_theme[data-theme='rouge'] h4 {
    /*    background: url(../img/themes-icons/theme_vaccination.png) no-repeat center top;
    */
    border-bottom: 2px solid #b63b69;
}

.slice_theme[data-theme='rouge']  .img {
    background-color: #b63b69;
    box-shadow: 0 0 0 1.5px #b63b69;
}

.slice_theme[data-theme='rouge_2'] h4 {
    border-bottom: 2px solid #e8484c;
}

.slice_theme[data-theme='rouge_2']  .img {
    background-color: #e8484c;
    box-shadow: 0 0 0 1.5px #e8484c;
}

.slice_theme[data-theme='vert'] h4 {
    /*    background: url(../img/themes-icons/theme_vie_saine.png) no-repeat center top;
    */
    border-bottom: 2px solid #b8c309;
}

.slice_theme[data-theme='vert']  .img {
    background-color: #b8c309;
    box-shadow: 0 0 0 1.5px #b8c309;
}

.slice_theme[data-theme='orange'] h4 {
    /*    background: url(../img/themes-icons/theme_jeune_ado.png) no-repeat center top;
    */
    border-bottom: 2px solid #df8075;
}

.slice_theme[data-theme='orange']  .img {
    background-color: #df8075;
    box-shadow: 0 0 0 1.5px #df8075;
}

.slice_theme[data-theme='vert_2'] h4 {
    /*    background: url(../img/themes-icons/theme_nutrition.png) no-repeat center top;
    */
    border-bottom: 2px solid #92b84a;
}

.slice_theme[data-theme='vert_2'] .img {
    background-color: #92b84a;
    box-shadow: 0 0 0 1.5px #92b84a;
}

.slice_theme[data-theme='vert_3'] h4 {
    /*    background: url(../img/themes-icons/theme_nutrition.png) no-repeat center top;
    */
    border-bottom: 2px solid #b2bc3f;
}

.slice_theme[data-theme='vert_3'] .img {
    background-color: #b2bc3f;
    box-shadow: 0 0 0 1.5px #b2bc3f;
}

.slice_theme[data-theme='violet'] h4 {
    /*    background: url(../img/themes-icons/theme_mere_enfant.png) no-repeat center top;
    */
    border-bottom: 2px solid #8252ba;
}

.slice_theme[data-theme='violet'] .img {
    background-color: #8252ba;
    box-shadow: 0 0 0 1.5px #8252ba;
}

.slice_theme[data-theme='bleu-fonce'] h4 {
    /*background: url(../img/themes-icons/theme_citoynnete.png) no-repeat center top;*/
    border-bottom: 2px solid #4a6eb8;
}

.slice_theme[data-theme='bleu-fonce'] .img {
    background-color: #4a6eb8;
    box-shadow: 0 0 0 1.5px #4a6eb8;
}

.slice_theme[data-theme='bleu'] h4 {
    /*background: url(../img/themes-icons/theme_hygiene.png) no-repeat center top;*/
    border-bottom: 2px solid #67afbc;
}

.slice_theme[data-theme='bleu'] .img {
    background-color: #67afbc;
    box-shadow: 0 0 0 1.5px #67afbc;
}

.slice_theme[data-theme='gris'] h4 {
    border-bottom: 2px solid #7EA9B8;
}

.slice_theme[data-theme='gris'] .img {
    background-color: #7EA9B8;
    box-shadow: 0 0 0 1.5px #7EA9B8;
}

.slice_theme[data-theme='jaune'] h4 {
    border-bottom: 2px solid #D8A936;
}

.slice_theme[data-theme='jaune'] .img {
    background-color: #D8A936;
    box-shadow: 0 0 0 1.5px #D8A936;
}

.slice_theme[data-theme='violet_2'] h4 {
    border-bottom: 2px solid #615FB8;
}

.slice_theme[data-theme='violet_2'] .img {
    background-color: #615FB8;
    box-shadow: 0 0 0 1.5px #615FB8;
}

.slice_theme a {
    color: #a2a940;
    font-weight: bold;
    font-size: 0.9em;
    cursor: pointer;
}

.slice_theme p {
    line-height: 1.3;
    font-size: 0.9em;
}

.sec_portail {
    background-color: #fbfbfb;
}

.sec_portail h3, .la-une h3, .sec_themes h3 {
    color: #26a742;
    font-size: 1.4em;
    line-height: 2;
}

.sec_portail h3::after, .sec_themes h3::after {
    content: '';
    width: 65px;
    height: 1px;
    background-color: #26a742;
    position: relative;
    margin: 10px auto;
    display: block;
}

.sec_portail p {
    margin: 25px auto;
    width: 80%
}

.sec_portail a.goto {
    display: block;
    width: 50px;
    height: 50px;
    margin: 0 auto;
    background: url(../img/goto_arrow.png) no-repeat center;
    cursor: pointer;
}

.footer {
    background-color: #fff;
    margin-bottom: 30px;
}

.footer ul {
    list-style: none
}

.footer ul li {
    display: inline-block;
    font-family: 'raleway', sans serif;
    margin: 0 25px;
}

.footer ul li a {
    color: #333e36;
    cursor: pointer;
    font-size: 0.9em;
    font-weight: 400;
}

#myCarousel .block_art {
    padding: 8px;
}

#myCarousel .block_art > div {
    background-color: grey;
    height: 16vw;
    overflow: hidden;
    position: relative;
    color: white;
}

#myCarousel .block_art > div .inner {
    padding: 30px 40px;
    text-align: left;
}

#myCarousel .block_art > div .inner span {
    font-weight: 500;
    font-size: 18px;
}

#myCarousel .block_art > div .inner h3 {
    font-weight: 600;
    margin: 20px 0;
    font-family: 'raleway';
}

#myCarousel .block_art > div .inner p {
    font-size: 15px;
}

#myCarousel .block_art svg {
    width: 40%;
    height: 90%;
    opacity: 0.3;
}

#myCarousel .block_art h4 {
    color: white;

    font-size: 18px;

    font-weight: 500;

    position: absolute;

    bottom: 20px;
    width: 100%;
    padding: 0 20px;
    text-align: center
}

#slide1 .block_art:nth-child(1) > div {
    background-color: #d49424;
}

#slide1 .block_art:nth-child(3) > div {
    background-color: #8faf00;
}

#slide1 .block_art:nth-child(5) > div {
    background-color: #2b94ad;
}

#slide2 .block_art:nth-child(1) > div, #slide1 .block_art:nth-child(1) > div {
    background-color: #92b84a;
    height: calc(36vw + 16px);
}

#slide2 .block_art:nth-child(2) > div {
    background-color: #fff;
    color: #38403a
}

#slide2 .block_art:nth-child(2) > div .inner span {
    color: #92a23a
}

#myCarousel .carousel-inner {
    width: 95%;
    margin: 0 auto;
}

.corner {
    display: block;
    width: calc(100% - 30px);
    height: calc(100% - 30px);
    margin: 15px;
    background: url(../img/corner.png) no-repeat right top;
    position: absolute;
    z-index: 3;
    cursor: pointer;
}

#home_imc #imc {
    padding-top: 0;
}

::-webkit-input-placeholder {

    padding-left: 10px;

}

:-moz-placeholder { /* Firefox 18- */

    padding-left: 10px;

}

::-moz-placeholder { /* Firefox 19+ */

    padding-left: 10px;

}

:-ms-input-placeholder {

    padding-left: 10px;

}

#imc input[type="number"] {
    height: 40px;
    border-radius: 4px;
    border: 0;
    margin-right: 5px;
    width: 150px;
}

#home_imc .res_imc, #home_imc #avis {
    color: #48670d;
    text-align: left;
    font-size: 15px;
    font-weight: 500
}

#home_imc .res_imc span {
    font-size: 48px;
    line-height: 60px;
}

#home_imc .resultat {
    width: 50%;
    margin: 50px 0 0 0;
}

/************************************* a propos ***************************************************/

.sec_apropos {
    width: 95%;
    margin: 0 auto;
    padding: 30px 20px;
    background: #fff;
    margin-top: 20px;
}

.sec_videos {
    width: 95%;
    margin: 0 auto;
    background: #f6f6f6;
}
.sec_videos_la_une {
    background: #fff;
    padding:45px 40px 35px 25px;
    margin-bottom: 30px;
}
.sec_videos.sec_videos_la_une h3 {
    color: #272727;
    text-align: left;
    margin: 0 40px;
    line-height: 1;
    font-size: 1.4em;
    font-family: 'raleway';
}
.sec_videos.sec_videos_la_une h3::after {
    content: '';
    width: 35px;
    height: 1px;
    background-color: #272727;
    position: relative;
    margin: 25px 0 0;
    display: block;
}
span.titre_video {
    float: left;
    margin: 25px 40px 0;
    font-size: 1.6em;
    color: #26a742;
    font-family: 'DinnextRegular';
}
span.chaine_video {
    float: left;
    margin: 20px 40px;
}


.sec_apropos h3, .sec_numeros h3, .sec_videos h3 {
    color: #26a742;
    font-size: 1.4em;
    line-height: 2;
    margin: 20px 0;
    text-align: center;
    font-family: 'raleway';
}

.sec_apropos h3::after, .sec_numeros h3::after, .sec_videos h3::after {
    content: '';
    width: 65px;
    height: 1px;
    background-color: #26a742;
    position: relative;
    margin: 10px auto;
    display: block;
}

.sec_apropos p,.sec_videos p {
    margin: 25px auto;
    width: 80% !important;
}

.themes-slider {
    padding: 0 70px;
    position: relative;
    margin: 40px 0;
}

.actu a {
    color: rgb(107, 107, 107)
}

/********************************************************** Dialog *****************************************************************************/

.dialog,
.dialog__overlay {

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

}

.dialog {

    position: fixed;

    display: -webkit-flex;

    display: flex;

    -webkit-align-items: center;

    align-items: center;

    -webkit-justify-content: center;

    justify-content: center;

    pointer-events: none;

    z-index: 30;

}

.dialog__overlay {

    position: absolute;

    z-index: 1;

    background: rgba(55, 58, 71, 0.9);

    opacity: 0;

    -webkit-transition: opacity 0.3s;

    transition: opacity 0.3s;

    -webkit-backface-visibility: hidden;

}

#dialog_close {

    border: none;

    background: #25A642;

    color: white;

    width: 40px;

    height: 35px;

    font-weight: 500;

    position: absolute;

    right: -2px;

    top: 0px;

    padding: 5px 14px;

    cursor: pointer;

}

.corps_form > div {
    margin: 20px 0;
}

.dialog--open .dialog__overlay {

    opacity: 1;

    pointer-events: auto;

}

.btn_cnx {

    padding: 10px 25px;

    background: #25A642;

    color: #fff;

    border: none;

    font-size: 11pt;

    width: 50%;

    margin: 0 25%;

}

.dialog__content {

    width: 50%;

    max-width: 560px;

    min-width: 290px;

    background: #fff;

    padding: 4em;

    text-align: center;

    position: relative;

    z-index: 5;

    opacity: 0;

}

.dialog--open .dialog__content {

    pointer-events: auto;

}

#form_cnx label {

    width: 150px;

}

/* Content */

.dialog h2 {

    font-weight: 500;

    font-family: 'Raleway';

    font-size: 1.4em;

    text-transform: uppercase;

    padding: 0 0 2em;

    text-align: center;

    margin: 0;
    color: #38403A;

}

.dialog--open .dialog__overlay {

    -webkit-transition-duration: 0.8s;

    transition-duration: 0.8s;

}

.dialog--close .dialog__overlay {

    -webkit-transition-duration: 0.5s;

    transition-duration: 0.5s;

}

.dialog__content {

    padding: 0;

    background: transparent;

}

.dialog.dialog--open .dialog__content {

    opacity: 1;

}

.morph-shape {

    position: absolute;

    width: calc(100% + 4px);

    height: calc(100% + 4px);

    top: -2px;

    left: -2px;

    z-index: -1;

}

.morph-shape svg rect {

    stroke: #fff;

    stroke-width: 2px;

    stroke-dasharray: 1680;

}

.dialog--open .morph-shape svg rect {

    -webkit-animation: anim-dash 0.6s forwards;

    animation: anim-dash 0.6s forwards;

}

.dialog-inner {

    opacity: 0;

    background: #fff;

}

.dialog--open .dialog-inner {

    padding: 2.5em 4em;

    opacity: 1;

    -webkit-transition: opacity 0.85s 0.35s;

    transition: opacity 0.85s 0.35s;

    text-align: left;

}

.dialog.dialog--open h2 {

    -webkit-animation: anim-elem-1 0.7s ease-out both;

    animation: anim-elem-1 0.7s ease-out both;

}

.dialog.dialog--open input[type=submit] {

    -webkit-animation: anim-elem-2 0.7s ease-out both;

    animation: anim-elem-2 0.7s ease-out both;

}

#form_newsletter h2 {
    padding: 0 0 1.5em;
}

#mobile_dialog h2 {
    padding: 20px;
}

#form_newsletter .btn_cnx {
    display: inline;

    padding: 0.6em 1.5em;

    text-align: center;

    white-space: nowrap;

    vertical-align: baseline;

    border-radius: .25em;

    width: 70px;

    margin: 0;
    float: right
}

.dialog input[type="text"], .dialog input[type="email"], .dialog input[type="password"] {

    height: 45px;

    border-radius: 4px;

    border: 0;
    margin: 0 10px;

    background-color: #E8E8E8;

}

#form_newsletter input[type="text"],
#form_newsletter input[type="email"] {

    width: 270px;

}

@keyframes anim-dash {

    0% {

        stroke-dashoffset: 1680;

    }

    100% {

        stroke-dashoffset: 0;

    }

}

@-webkit-keyframes anim-dash {

    0% {

        stroke-dashoffset: 1680;

    }

    100% {

        stroke-dashoffset: 0;

    }

}

/* Inner elements animations */

@-webkit-keyframes anim-elem-1 {

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-150px, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
    }

}

@keyframes anim-elem-1 {

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-150px, 0, 0);
        transform: translate3d(-150px, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

}

@-webkit-keyframes anim-elem-2 {

    0% {
        opacity: 0;
        -webkit-transform: translate3d(150px, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
    }

}

@keyframes anim-elem-2 {

    0% {
        opacity: 0;
        -webkit-transform: translate3d(150px, 0, 0);
        transform: translate3d(150px, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

}

.dialog {

    visibility: hidden;

    opacity: 0;

}

.dialog.dialog--open {

    visibility: visible;

    opacity: 1;

}

/******************************zinir*********************************/

.list-hex-grid .col-md-4 {
    padding: 5px;
}

select#age {

    padding: 5px 10px;

    border: none;

    border-radius: 6px;

    width: 300px;

    border: 1px solid #24A03D;

}

/********************************** responsive menu *********************************************/

.cd-main-header, .cd-overlay, .cd-nav {
    display: none;
}

@media only screen and (max-width: 1024px) {

    /*menu*/
    .cd-primary-nav li {
        display: block;
        padding: 5px 15px;
        padding-top: 0;
        text-align: left
    }

    /* --------------------------------



Main components



-------------------------------- */
    .cd-main-content, .cd-main-header {

        /* Force Hardware Acceleration in WebKit */

        /*-webkit-transform: translateZ(0);

  -moz-transform: translateZ(0);

  -ms-transform: translateZ(0);

  -o-transform: translateZ(0);

  transform: translateZ(0);

  will-change: transform;*/

    }

    .cd-main-content, .cd-main-header {

        /*position: relative;*/

        -webkit-transition: -webkit-transform 0.3s;

        -moz-transition: -moz-transform 0.3s;

        transition: transform 0.3s;

    }

    .cd-main-content.nav-is-visible, .cd-main-header.nav-is-visible {

        -webkit-transform: translateX(-260px);

        -moz-transform: translateX(-260px);

        -ms-transform: translateX(-260px);

        -o-transform: translateX(-260px);

        transform: translateX(-260px);

    }

    .nav-on-left .cd-main-content.nav-is-visible, .nav-on-left .cd-main-header.nav-is-visible {

        -webkit-transform: translateX(260px);

        -moz-transform: translateX(260px);

        -ms-transform: translateX(260px);

        -o-transform: translateX(260px);

        transform: translateX(260px);

    }

    .cd-main-content {

        background: #f2f3f4 url(../img/bg.png) no-repeat left top;

        background-size: 330px;

        z-index: 2;

        /*overflow: hidden*/

    }

    .trophee_content {
        top: 0
    }

    #jurys .cd-main-content {
        background: #fff
    }

    .cd-main-header {

        height: 75px;

        background: #ffffff;

        z-index: 3;

    }

    .nav-is-fixed .cd-main-header {

        /* add .nav-is-fixed class to body if you want a fixed navigation on > 1170px */

        position: fixed;

        top: 0;

        left: 0;

        width: 100%;

    }

    .nav-on-left .cd-logo {

        left: auto;

        right: 5%;

    }

    .cd-header-buttons {

        position: absolute;

        display: inline-block;

        top: 25px;

        right: 3%;

    }

    .cd-header-buttons li {

        display: inline-block;

    }

    @media only screen and (max-width: 1169px) {

        .nav-on-left .cd-header-buttons {

            right: auto;

            left: 5%;

        }

        .nav-on-left .cd-header-buttons li {

            float: right;

        }

    }

    .cd-search-trigger, .cd-nav-trigger {

        position: relative;

        display: block;

        width: 44px;

        height: 44px;

        overflow: hidden;

        white-space: nowrap;

        /* hide text */

        color: transparent;

        z-index: 3;

    }

    .cd-search-trigger::before, .cd-search-trigger::after {

        /* search icon */

        content: '';

        position: absolute;

        -webkit-transition: opacity 0.3s;

        -moz-transition: opacity 0.3s;

        transition: opacity 0.3s;

        /* Force Hardware Acceleration in WebKit */

        -webkit-transform: translateZ(0);

        -moz-transform: translateZ(0);

        -ms-transform: translateZ(0);

        -o-transform: translateZ(0);

        transform: translateZ(0);

        -webkit-backface-visibility: hidden;

        backface-visibility: hidden;

    }

    .cd-search-trigger::before {

        /* lens */

        top: 11px;

        left: 11px;

        width: 18px;

        height: 18px;

        border-radius: 50%;

        border: 3px solid #2e3233;

    }

    .cd-search-trigger::after {

        /* handle */

        height: 3px;

        width: 8px;

        background: #2e3233;

        bottom: 14px;

        right: 11px;

        -webkit-transform: rotate(45deg);

        -moz-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

        -o-transform: rotate(45deg);

        transform: rotate(45deg);

    }

    .cd-search-trigger span {

        /* container for the X icon */

        position: absolute;

        height: 100%;

        width: 100%;

        top: 0;

        left: 0;

    }

    .cd-search-trigger span::before, .cd-search-trigger span::after {

        /* close icon */

        content: '';

        position: absolute;

        display: inline-block;

        height: 3px;

        width: 22px;

        top: 50%;

        margin-top: -2px;

        left: 50%;

        margin-left: -11px;

        background: #2e3233;

        opacity: 0;

        /* Force Hardware Acceleration in WebKit */

        -webkit-transform: translateZ(0);

        -moz-transform: translateZ(0);

        -ms-transform: translateZ(0);

        -o-transform: translateZ(0);

        transform: translateZ(0);

        -webkit-backface-visibility: hidden;

        backface-visibility: hidden;

        -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;

        -moz-transition: opacity 0.3s, -moz-transform 0.3s;

        transition: opacity 0.3s, transform 0.3s;

    }

    .cd-search-trigger span::before {

        -webkit-transform: rotate(45deg);

        -moz-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

        -o-transform: rotate(45deg);

        transform: rotate(45deg);

    }

    .cd-search-trigger span::after {

        -webkit-transform: rotate(-45deg);

        -moz-transform: rotate(-45deg);

        -ms-transform: rotate(-45deg);

        -o-transform: rotate(-45deg);

        transform: rotate(-45deg);

    }

    .cd-search-trigger.search-is-visible::before, .cd-search-trigger.search-is-visible::after {

        /* hide search icon */

        opacity: 0;

    }

    .cd-search-trigger.search-is-visible span::before, .cd-search-trigger.search-is-visible span::after {

        /* show close icon */

        opacity: 1;

    }

    .cd-search-trigger.search-is-visible span::before {

        -webkit-transform: rotate(135deg);

        -moz-transform: rotate(135deg);

        -ms-transform: rotate(135deg);

        -o-transform: rotate(135deg);

        transform: rotate(135deg);

    }

    .cd-search-trigger.search-is-visible span::after {

        -webkit-transform: rotate(45deg);

        -moz-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

        -o-transform: rotate(45deg);

        transform: rotate(45deg);

    }

    .cd-nav-trigger span, .cd-nav-trigger span::before, .cd-nav-trigger span::after {

        /* hamburger icon in CSS */

        position: absolute;

        display: inline-block;

        height: 3px;

        width: 25px;

        background: #2e3233;

    }

    .cd-nav-trigger span {

        /* line in the center */

        position: absolute;

        top: 50%;

        right: 10px;

        margin-top: -2px;

        -webkit-transition: background 0.3s 0.3s;

        -moz-transition: background 0.3s 0.3s;

        transition: background 0.3s 0.3s;

    }

    .cd-nav-trigger span::before, .cd-nav-trigger span::after {

        /* other 2 lines */

        content: '';

        right: 0;

        /* Force Hardware Acceleration in WebKit */

        -webkit-transform: translateZ(0);

        -moz-transform: translateZ(0);

        -ms-transform: translateZ(0);

        -o-transform: translateZ(0);

        transform: translateZ(0);

        -webkit-backface-visibility: hidden;

        backface-visibility: hidden;

        -webkit-transform-origin: 0% 50%;

        -moz-transform-origin: 0% 50%;

        -ms-transform-origin: 0% 50%;

        -o-transform-origin: 0% 50%;

        transform-origin: 0% 50%;

        -webkit-transition: -webkit-transform 0.3s 0.3s;

        -moz-transition: -moz-transform 0.3s 0.3s;

        transition: transform 0.3s 0.3s;

    }

    .cd-nav-trigger span::before {

        /* menu icon top line */

        top: -6px;

    }

    .cd-nav-trigger span::after {

        /* menu icon bottom line */

        top: 6px;

    }

    .cd-nav-trigger.nav-is-visible span {

        /* hide line in the center */

        background: rgba(46, 50, 51, 0);

    }

    .cd-nav-trigger.nav-is-visible span::before, .cd-nav-trigger.nav-is-visible span::after {

        /* keep visible other 2 lines */

        background: #2e3233;

    }

    .cd-nav-trigger.nav-is-visible span::before {

        -webkit-transform: translateX(4px) translateY(-3px) rotate(45deg);

        -moz-transform: translateX(4px) translateY(-3px) rotate(45deg);

        -ms-transform: translateX(4px) translateY(-3px) rotate(45deg);

        -o-transform: translateX(4px) translateY(-3px) rotate(45deg);

        transform: translateX(4px) translateY(-3px) rotate(45deg);

    }

    .cd-nav-trigger.nav-is-visible span::after {

        -webkit-transform: translateX(4px) translateY(2px) rotate(-45deg);

        -moz-transform: translateX(4px) translateY(2px) rotate(-45deg);

        -ms-transform: translateX(4px) translateY(2px) rotate(-45deg);

        -o-transform: translateX(4px) translateY(2px) rotate(-45deg);

        transform: translateX(4px) translateY(2px) rotate(-45deg);

    }

    .cd-primary-nav, .cd-primary-nav ul {

        position: fixed;

        top: 0;

        right: 0;

        height: 100%;

        width: 260px;

        background: #131519;

        overflow: auto;

        -webkit-overflow-scrolling: touch;

        z-index: 1;

        /* Force Hardware Acceleration in WebKit */

        -webkit-transform: translateZ(0);

        -moz-transform: translateZ(0);

        -ms-transform: translateZ(0);

        -o-transform: translateZ(0);

        transform: translateZ(0);

        -webkit-transform: translateX(0);

        -moz-transform: translateX(0);

        -ms-transform: translateX(0);

        -o-transform: translateX(0);

        transform: translateX(0);

        -webkit-transition: -webkit-transform 0.3s;

        -moz-transition: -moz-transform 0.3s;

        transition: transform 0.3s;

    }

    .cd-primary-nav a, .cd-primary-nav ul a {

        display: block;

        height: 50px;

        line-height: 50px;

        padding: 0 20px;

        color: #ffffff;

        -webkit-font-smoothing: antialiased;

        -moz-osx-font-smoothing: grayscale;

        overflow: hidden;

        text-overflow: ellipsis;

        white-space: nowrap;

        border-bottom: 1px solid rgba(58, 63, 64, 0.32);

        -webkit-transform: translateZ(0);

        -moz-transform: translateZ(0);

        -ms-transform: translateZ(0);

        -o-transform: translateZ(0);

        transform: translateZ(0);

        will-change: transform, opacity;

        -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;

        -moz-transition: -moz-transform 0.3s, opacity 0.3s;

        transition: transform 0.3s, opacity 0.3s;

    }

    .cd-primary-nav.is-hidden, .cd-primary-nav ul.is-hidden {

        /* secondary navigations hidden by default */

        -webkit-transform: translateX(100%);

        -moz-transform: translateX(100%);

        -ms-transform: translateX(100%);

        -o-transform: translateX(100%);

        transform: translateX(100%);

    }

    .cd-primary-nav.moves-out > li > a, .cd-primary-nav ul.moves-out > li > a {

        /* push the navigation items to the left - and lower down opacity - when secondary nav slides in */

        -webkit-transform: translateX(-100%);

        -moz-transform: translateX(-100%);

        -ms-transform: translateX(-100%);

        -o-transform: translateX(-100%);

        transform: translateX(-100%);

        opacity: 0;

    }

    @media only screen and (max-width: 1169px) {

        .nav-on-left .cd-primary-nav, .nav-on-left .cd-primary-nav ul {

            right: auto;

            left: 0;

        }

    }

    .cd-primary-nav .see-all a {

        color: #fff;

    }

    .cd-primary-nav .see-all a img {

        padding: 5px;

        /*height: 100%;*/
        width: 45px;

        float: left;

        box-sizing: border-box;

        margin-right: 15px;

    }

    .cd-primary-nav .cd-nav-icons .cd-nav-item {

        padding-left: 75px;

    }

    .cd-primary-nav .cd-nav-icons .cd-nav-item p {

        color: #2e3233;

        font-size: 1.3rem;

        /* hide description on small devices */

        display: none;

    }

    .cd-primary-nav .cd-nav-icons .cd-nav-item::before {

        /* item icon */

        content: '';

        display: block;

        position: absolute;

        left: 20px;

        top: 50%;

        margin-top: -20px;

        width: 40px;

        height: 40px;

        background-repeat: no-repeat;

        background-position: center center;

        background-size: 40px 40px;

    }

    @media only screen and (max-width: 1169px) {

        .cd-primary-nav {

            /* by default .cd-primary-nav is hidden - trick for iOS devices where you can see the navigation if you pull down */

            visibility: hidden;

            -webkit-transition: visibility 0s 0.3s;

            -moz-transition: visibility 0s 0.3s;

            transition: visibility 0s 0.3s;

        }

        .cd-primary-nav.nav-is-visible {

            visibility: visible;

            -webkit-transition: visibility 0s 0s;

            -moz-transition: visibility 0s 0s;

            transition: visibility 0s 0s;

        }

    }



    .has-children > a, .go-back a {

        position: relative;

    }

    .has-children > a::before, .has-children > a::after, .go-back a::before, .go-back a::after {

        /* arrow icon in CSS - for element with nested unordered lists */

        content: '';

        position: absolute;

        top: 50%;

        margin-top: -1px;

        display: inline-block;

        height: 2px;

        width: 10px;

        background: #464c4e;

        -webkit-backface-visibility: hidden;

        backface-visibility: hidden;

    }

    .has-children > a::before, .go-back a::before {

        -webkit-transform: rotate(45deg);

        -moz-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

        -o-transform: rotate(45deg);

        transform: rotate(45deg);

    }

    .has-children > a::after, .go-back a::after {

        -webkit-transform: rotate(-45deg);

        -moz-transform: rotate(-45deg);

        -ms-transform: rotate(-45deg);

        -o-transform: rotate(-45deg);

        transform: rotate(-45deg);

    }

    .has-children > a {

        padding-right: 40px;

    }

    .has-children > a::before, .has-children > a::after {

        /* arrow goes on the right side - children navigation */

        right: 20px;

        -webkit-transform-origin: 9px 50%;

        -moz-transform-origin: 9px 50%;

        -ms-transform-origin: 9px 50%;

        -o-transform-origin: 9px 50%;

        transform-origin: 9px 50%;

    }

    .cd-primary-nav .go-back a {

        padding-left: 40px;

    }

    .cd-primary-nav .go-back a::before, .cd-primary-nav .go-back a::after {

        /* arrow goes on the left side - go back button */

        left: 20px;

        -webkit-transform-origin: 1px 50%;

        -moz-transform-origin: 1px 50%;

        -ms-transform-origin: 1px 50%;

        -o-transform-origin: 1px 50%;

        transform-origin: 1px 50%;

    }

    .cd-search {

        position: absolute;

        height: 50px;

        width: 100%;

        top: 50px;

        left: 0;

        z-index: 3;

        opacity: 0;

        visibility: hidden;

        -webkit-transition: opacity .3s 0s, visibility 0s .3s;

        -moz-transition: opacity .3s 0s, visibility 0s .3s;

        transition: opacity .3s 0s, visibility 0s .3s;

    }

    .cd-search form {

        height: 100%;

        width: 100%;

    }

    .cd-search input {

        border-radius: 0;

        border: none;

        background: #ffffff;

        height: 100%;

        width: 100%;

        padding: 0 5%;

        box-shadow: inset 0 1px 0 #e2e3df, 0 3px 6px rgba(0, 0, 0, 0.05);

        -webkit-appearance: none;

        -moz-appearance: none;

        -ms-appearance: none;

        -o-appearance: none;

        appearance: none;

    }

    .cd-search input::-webkit-input-placeholder {

        color: #c9cbc4;

    }

    .cd-search input::-moz-placeholder {

        color: #c9cbc4;

    }

    .cd-search input:-moz-placeholder {

        color: #c9cbc4;

    }

    .cd-search input:-ms-input-placeholder {

        color: #c9cbc4;

    }

    .cd-search input:focus {

        outline: none;

    }

    .cd-search.is-visible {

        opacity: 1;

        visibility: visible;

        -webkit-transition: opacity .3s 0s, visibility 0s 0s;

        -moz-transition: opacity .3s 0s, visibility 0s 0s;

        transition: opacity .3s 0s, visibility 0s 0s;

    }

    .nav-is-fixed .cd-search {

        position: fixed;

    }

    .cd-overlay {

        /* shadow layer visible when navigation is active */

        position: fixed;

        z-index: 999;

        height: 100%;

        width: 100%;

        top: 0;

        left: 0;

        cursor: pointer;

        background-color: rgba(0, 0, 0, 0.5);

        visibility: hidden;

        opacity: 0;

        -webkit-backface-visibility: hidden;

        backface-visibility: hidden;

        -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s, -webkit-transform 0.3s 0s;

        -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s, -moz-transform 0.3s 0s;

        transition: opacity 0.3s 0s, visibility 0s 0.3s, transform 0.3s 0s;

    }

    .cd-overlay.is-visible {

        opacity: 1;

        visibility: visible;

        -webkit-transition: opacity 0.3s 0s, visibility 0s 0s, -webkit-transform 0.3s 0s;

        -moz-transition: opacity 0.3s 0s, visibility 0s 0s, -moz-transform 0.3s 0s;

        transition: opacity 0.3s 0s, visibility 0s 0s, transform 0.3s 0s;

    }

    /* --------------------------------



    support for no js



    -------------------------------- */
    .no-js .cd-primary-nav {

        position: relative;

        height: auto;

        width: 100%;

        overflow: visible;

        visibility: visible;

        z-index: 2;

    }

    .no-js .cd-search {

        position: relative;

        top: 0;

        opacity: 1;

        visibility: visible;

    }

}

@media only screen and (max-width: 1024px) {

    .t-hide {
        display: none;
    }

    .cd-main-header, .cd-overlay, .cd-nav {
        display: block;
    }

    .container {
        top: 0
    }

}

@media only screen and (max-width: 1169px) {

    .cd-overlay.is-visible {

        -webkit-transform: translateX(-260px);

        -moz-transform: translateX(-260px);

        -ms-transform: translateX(-260px);

        -o-transform: translateX(-260px);

        transform: translateX(-260px);

    }

    .nav-on-left .cd-overlay.is-visible {

        -webkit-transform: translateX(260px);

        -moz-transform: translateX(260px);

        -ms-transform: translateX(260px);

        -o-transform: translateX(260px);

        transform: translateX(260px);

    }

    .cd-overlay.is-visible.search-is-visible, .nav-on-left .cd-overlay.is-visible.search-is-visible {

        -webkit-transform: translateX(0);

        -moz-transform: translateX(0);

        -ms-transform: translateX(0);

        -o-transform: translateX(0);

        transform: translateX(0);

    }

}

@media only screen and (max-width: 360px) {

    .m-hide {
        display: none;
    }

}

/*************** Nexus Menu ******************/

*,
*:after,
*::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.gn-menu-main,
.gn-menu-main ul {
    margin: 0;
    padding: 0;
    background: #25A642;
    color: #5f6f81;
    list-style: none;
    text-transform: none;
    font-weight: 300;
    font-family: 'Raleway', Arial, sans-serif;
    line-height: 60px;
}

.gn-menu-main {
    position: fixed;
    top: 0;
    left: 0;
    width: 60px;
    height: 100%;
    font-size: 13px;
}

.gn-menu-main a {
    display: block;
    color: #FFFFFF;
    text-decoration: none;
    cursor: pointer;
    font-family: 'Raleway', sans serif;
    font-weight: 500;
}

.gn-menu-main a label {
    margin-left: 10px;
    cursor: pointer;
}

.no-touch .gn-menu-main a:hover,
.no-touch .gn-menu li.gn-search-item:hover,
.no-touch .gn-menu li.gn-search-item:hover a {
    color: white;
}

.gn-menu-main > li {
    display: block;
    float: left;
    height: 100%;
    border-right: 1px solid #c6d0da;
    text-align: center;
}

.gn-menu-main li.gn-trigger {
    position: relative;
    width: 60px;
    height: 100px;
    background: #19682F;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.gn-menu-main > li:last-child {
    float: right;
    border-right: none;
}

.gn-menu-main > li > a {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: bold;
}

.gn-menu-main:after {
    display: table;
    clear: both;
    content: "";
}

.gn-menu-wrapper {
    position: fixed;
    top: 100px;
    bottom: 0;
    height: 100%;
    left: 0;
    overflow: hidden;
    width: 60px;
    background: #25A642;
    -webkit-transform: translateX(-60px);
    -moz-transform: translateX(-60px);
    transform: translateX(-60px);
    -webkit-transition: -webkit-transform 0.3s, width 0.3s;
    -moz-transition: -moz-transform 0.3s, width 0.3s;
    transition: transform 0.3s, width 0.3s;
}

.gn-scroller {
    position: absolute;
    overflow-y: scroll;
    width: 300px;
    height: 100%;
}

.gn-menu {
    text-align: left;
    font-size: 18px;
}

input.gn-search {
    position: relative;
    z-index: 10;
    padding-left: 60px;
    outline: none;
    border: none;
    background: transparent;
    color: #5f6f81;
    font-weight: 300;
    font-family: 'Raleway', Arial, sans-serif;
    cursor: pointer;
}

.gn-search:-moz-placeholder {
    color: #5f6f81
}

.gn-search::-moz-placeholder {
    color: #5f6f81
}

.gn-search:-ms-input-placeholder {
    color: #5f6f81
}

.gn-search:focus::-webkit-input-placeholder,
.no-touch .gn-menu li.gn-search-item:hover .gn-search:focus::-webkit-input-placeholder {
    color: transparent
}

input.gn-search:focus {
    cursor: text
}

.no-touch .gn-menu li.gn-search-item:hover input.gn-search {
    color: white
}

.gn-icon::before {
    display: inline-block;
    width: 60px;
    text-align: center;
    text-transform: none;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    font-family: 'Raleway';
    line-height: 1;
    speak: none;
    -webkit-font-smoothing: antialiased;
}

.gn-icon-search::before {
    content: "\e005"
}

.gn-icon span {
    width: 0;
    height: 0;
    display: block;
    overflow: hidden;
}

.gn-icon img {
    width: 32px;
    margin: 0 0 0 6px;
    vertical-align: inherit;
}

.gn-icon-menu::before {
    margin-left: -15px;
    vertical-align: -2px;
    width: 30px;
    height: 3px;
    background: #25A642;
    box-shadow: 0 3px #19682F, 0 -6px #25A642, 0 -9px #19682F, 0 -12px #25A642;
    content: '';
    margin: 0 auto;
}

.no-touch .gn-icon-menu:hover::before,
.no-touch .gn-icon-menu.gn-selected:hover::before {
    background: white;
    box-shadow: 0 3px #19682F, 0 -6px white, 0 -9px #19682F, 0 -12px white;
}

.gn-icon-menu.gn-selected::before {
    background: #FFFFFF;
    box-shadow: 0 3px #19682F, 0 -6px #FFFFFF, 0 -9px #19682F, 0 -12px #FFFFFF;
}

.gn-menu-wrapper.gn-open-all,
.gn-menu-wrapper.gn-open-part {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    transform: translateX(0px);
}

.gn-menu-wrapper.gn-open-all {
    width: 280px;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

@media screen and (max-width: 422px) {
    .gn-menu-wrapper.gn-open-all {
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        transform: translateX(0px);
        width: 100%;
    }

    .gn-menu-wrapper.gn-open-all .gn-scroller {
        width: 130%
    }

}

/*************** Fin Nexus Menu ******************/

/*************** home.css **************************/

.noscroll {

    overflow: hidden;

}

/*

.theme_content {

    z-index: 99;

    position: fixed;

    top: 100px;

    bottom: 0;

    left: 50%;

    width: 100%;

    overflow-y: scroll;

    -webkit-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

    transform: translateX(-50%) translateY(100%);

}

.theme_content.thematique1,

.list-hex-grid div.hex.thematique1 > a,

.post_content.thematique1{

    background: #EE6557;

}

.theme_content.thematique2,

.list-hex-grid div.hex.thematique2 > a,

.post_content.thematique2{

    background: #16A6B6;

}

.theme_content.thematique3,

.list-hex-grid div.hex.thematique3 > a,

.post_content.thematique3{

    background: #2ecc71;

}

.theme_content.thematique4,

.list-hex-grid div.hex.thematique4 > a,

.post_content.thematique4{

    background: #9b59b6;

}

.theme_content.thematique5,

.list-hex-grid div.hex.thematique5 > a,

.post_content.thematique5{

    background: #e67e22;

}

.theme_content.thematique6,

.list-hex-grid div.hex.thematique6 > a,

.post_content.thematique6{

    background: #f1c40f;

}

.theme_content.thematique7,

.list-hex-grid div.hex.thematique7 > a,

.post_content.thematique7{

    background: #EE6557;

}



.theme_content .content {

    width: 90%;

    margin-top: 50px;

    margin: 0px auto;

    padding-top: 50px;

}



.theme_content.active {

    animation-name: show_block_content;

    animation-duration: .5s;

    animation-fill-mode: forwards;

    animation-delay: .5s;

}

.theme_content.noactive {

    animation-name: hide_block_content;

    animation-duration: .5s;

    animation-fill-mode: forwards;

}



.theme_content.active .close,

.post_content.active .close {

    z-index: 1;

    position: absolute;

    top: 10px;

    right: 10px;

    width: 30px;

    height: 30px;

    border: 1px solid #2c3e50;

    border-radius: 30px;

    text-decoration: none;

    -webkit-transition: all .3s;

    transition: all .3s;

    cursor: pointer;

}



.theme_content.active .close:hover,

.post_content.active .close:hover {

    border: 1px solid transparent;

    box-shadow: 0 0 0 4px #2c3e50;

    -webkit-transform: rotate(180deg);

    transform: rotate(180deg);

}

.close:after,

.close:before {

    content: '';

    display: block;

    position: absolute;

    top: 0;

    right: 0;

    left: -1px;

    width: 2PX;

    height: 15px;

    margin: 0 14px;

    margin-top: 7px;

    transform: rotate(-45deg);

    background: #2c3e50;

}



.close:before {

    transform: rotate(45deg);

}*/

/*#home-v1 .container, #home .container, #apropos .container, #numeros_utiles .container, #numeros_utiles .container, #numeros_utiles .container {
    overflow-y: auto;
}*/

#home, #home-v1 {
    background: #eee;
}

.slice {

    padding: 10px;

    opacity: 0;

}

.slice .colmarg {

    padding: 10px;

    background: #fff;

}

.slice p {

    text-align: left;

}

.content {

    margin-top: 50px;

}

.slice:before {

    content: '';

    display: block;

    z-index: 3;

    position: absolute;

    top: 0;

    right: -1px;

    left: -1px;

    height: 5px;

    padding: 0;

}

.slice.presentation:before,
.post_content.presentation {

    background: #27702c;

}

.slice.thematiques:before,
.post_content.thematiques {

    background: #369a4b;

}

.slice.connection:before,
.post_content.connection {

    background: #27ba62;

}

.slice.active:before {

    transition: all .5s;

    top: -60vh;

    height: calc(60vh + 5px);

    left: 0;

}

.slice.loadpost:before {

    left: 0;

    width: 100vw;

    transform: translateX(0);

    height: calc(100vh - 100px);

    z-index: 9;

    position: absolute;

    top: -60vh;

    left: 0;

    left: 100%;

    transform: translateX(-100%);

    margin-left: 1px;

}

.slice.loadpost.thematiques:before {

    left: 200%;

    margin-left: 5px;

}

.slice.loadpost.presentation:before {

    left: 300%;

    margin-left: 5px;

}

.parcours p {
    color: white;
    margin: 10px 70px;
    font-size: 0.9em;
}

.slice.loadpost .parcours li.diff1 {

    transition: all .8s;

}

.slice.loadpost .parcours li.diff2 {

    transition: all .6s;

}

.slice.loadpost .parcours li.diff3 {

    transition: all .4s;

}

.slice.loadpost .parcours li.diff4 {

    transition: all .2s;

}

.slice.loadpost .parcours li {

    transform: translateY(600px);

}

.slice.noactive {

    animation-name: hide_cat;

    animation-duration: 1s;

    animation-fill-mode: forwards;

    animation-delay: .1s;

    opacity: 1;

}

.slice.noactive.diff1 {

    animation-delay: .2s;

}

.slice.noactive.diff2 {

    animation-delay: .3s;

}

@keyframes show_cat {

    0% {

    }

    100% {

        top: -400px;

        height: 405px;

    }

}

@keyframes hide_cat {

    0% {

    }

    100% {

        top: 0px;

        height: 5px;

    }

}

@keyframes load_post {

    0% {

        position: fixed;

    }

    100% {

        position: fixed;

        top: 154px;

        height: calc(100vh - 154px);

        width: 100vw;

        z-index: 4;

        bottom: 0;

    }

}

@keyframes hide_post {

    0% {

    }

    100% {

        top: 0px;

        height: 5px;

    }

}

/*

@keyframes show_post_content{

    from{

    }

    to{

        transform: translateX(0%);

    }

}

@keyframes hide_post_content{

    from{

        transform: translateX(0%);

    }

    to{

        transform: auto;

    }

}

@keyframes hide_post_content_text{

    from{

        transform: translateX(0%);

    }

    to{

        transform: translateX(100%);

    }

}



*/

.home_content {

    opacity: 0;

}

.home_content.active {

    opacity: 1;

}

.interactive div.hex {

    opacity: 1 !important;

}

.theme_content,
.home_content {

    transition: all .5s;

}

.post_content .block_image img {

    border: 8px solid #fff;

    -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1);

    box-shadow: 0 0 30px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1);

    display: block;

    margin: 0 auto;

    width: auto;

  /*  padding: 20px; */

}

.nobackground {

    background: transparent !important;

}

.nodelay {

    animation-delay: 0s !important;

}

#slider_home {

    position: relative; /* can either be relative, absolute or fixed. If position is not set (i.e. static), it would be set to "relative" by script */

    overflow: hidden; /* to bound the empty top space created by inner element's top margin */

    width: 100%;

    min-height: 60vh;

    background-color: #DADADA;

}

.act-inner-content h1 {

    color: #fff;

    text-transform: inherit !important;

    font-family: 'Raleway', sans serif;

    font-size: 1.0em;font-weight: bold;

    margin: 0;
    text-shadow: none !important;

}

.blocks_cat {

    border-bottom: 1px solid #f3f3f0;

    height: 100px;

}

/*.blocks_cat:after{

    content: '';

    clear: both;

    display: block;

}*/

.blocks_cat .slice {

    display: block;

    border-right: 1px solid #f3f3f0;

    opacity: 1;

    min-height: 100px;

    background-color: #fff;

    border-bottom: 1px solid rgba(210, 210, 210, .2);

}

.blocks_cat .slice:nth-child(2) {

    border-left: 1px solid #D2D2D2;

    border-right: 1px solid #D2D2D2;

}

.blocks_cat .slice:first-child {

    border-left: 1px solid #f3f3f0;

}

.blocks_cat .slice a {
    z-index: 9999999;
    position: relative;
    display: block;
    padding: 15px 10px 0;

}

.blocks_cat .slice ul li a {
    padding-top: 0
}

.blocks_cat .slice a h3 {

    color: #38403a;

    text-transform: uppercase;

    max-width: 80%;

    margin: 0 auto;

}

.blocks_cat .slice a span {

    color: #a1a2a1;

}

.zs-enabled .zs-slideshow .zs-bullets {

    display: none;

}

.blocks_cat .parcours {

    display: block;

    height: 400px;

    width: 100%;

    position: absolute;

    top: -60vh;

    left: 0;

    z-index: 4;

    opacity: 0;

    visibility: hidden;
    display: table

}

.blocks_cat .slice .parcours h4 {
    margin-top: 9vh;
}

.blocks_cat .parcours a {
    color: #fff;
    font-weight: 500;
    font-family: "Raleway", sans serif;
    font-size: 0.8em;
}

.blocks_cat .slice.active .parcours {

    opacity: 1;

    visibility: visible;

}

.blocks_cat .slice .parcours h4 {

    color: white;

    font-size: 18px;

    font-weight: 500;

    font-family: "Raleway", sans serif;

}

.parcours ul li a {

    color: #fff;

}

.parcours ul li:first-child {

    color: #fff;

    font-family: "Raleway";

    font-size: 24px;

    margin-bottom: 30px;

}

.parcours ul li:first-child:after,
.parcours ul li:first-child:before {

    display: none;

}

.parcours ul li:after {

    content: '';

    width: 60%;

    display: block;

    height: 2px;

    opacity: .27;

    background-color: #fff;

    margin: 0 auto;

    position: absolute;

    bottom: 0;

    left: 0;

    right: 0;

}

.parcours ul li:before {

    content: "\e013";

    position: relative;

    top: 1px;

    display: inline-block;

    font-family: 'Glyphicons Halflings';

    font-style: normal;

    font-weight: 400;

    line-height: 1;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

    left: 20%;

    position: absolute;

    bottom: 0;

    line-height: 46px;

}

#act_slider .infos_top span {

    color: #fff;

    font-family: "Raleway";

    font-size: 15px;

    float: left;

}

#act_slider .infos_top span.date {

    color: #fff;

    font-family: "Raleway";

    font-size: 13px;

    float: right;

}

#act_slider .infos_top:after {

    content: '';

    display: block;

    clear: both;

}

#act_slider .infos_top {

    padding-bottom: 20px;

    margin-bottom: 20px;

    border-bottom: 1px solid #3f4137;

}

#act_slider .body .text {

    color: #fff;

    font-family: "Raleway";

    font-size: 15px;

    float: left;

    text-align: left;

}

#act_slider .body a.read_more {

    background-color: #3f4137;

    color: #fff;

    font-family: "Raleway";

    font-size: 13px;

    text-decoration: none;

    padding: 0 10px;

    height: 35px;

    margin-top: 20px;

    display: block;

    float: left;

    line-height: 35px

}

.lSSlideOuter.vertical .lSAction > .lSNext,
.lSSlideOuter.vertical .lSAction > .lSPrev {

    width: 95px;

    height: 27px;

    background-color: #3e4137;

}

.lSSlideOuter.vertical .lSAction > .lSPrev {

    margin-left: 0px !important;

}

.lSSlideOuter.vertical .lSAction > .lSNext {

    margin-left: -40% !important;

}

.lSSlideOuter.vertical .lSAction > .lSPrev {

    bottom: 10px !important;

    top: auto !important;

}

.lSSlideOuter.vertical .lSAction > .lSPrev:after,
.lSSlideOuter.vertical .lSAction > .lSNext:after {

    content: '<';

    color: #fff;

    font-family: "Raleway";

    font-size: 30px;

    transform: rotate(90deg);

    position: relative;

    display: block;

}

.lSSlideOuter.vertical .lSAction > .lSNext:after {

    transform: rotate(-90deg);

}

.lSPager {

    display: none;

}

section.outils_sec, section.dossier_mois {
    width: 95%;
    margin: 0 auto;
    padding: 50px 0
}

section.dossier_mois {
    background: transparent;
    margin-top: 0px;
}

section.outils_sec h2, section.dossier_mois h2, section.search h2 {
    color: #64943a;
    font-size: 1.4em;
    line-height: 2;
}

section.outils_sec h2::after, section.dossier_mois h2::after, section.search h2::after {
    content: '';

    width: 40px;

    height: 1px;

    background-color: #649662;

    position: relative;

    margin: 3px auto;

    display: block;
}

.outils_sec .outil_bloc {
    height: 250px;
    display: inline-block;
    padding: 20px 10px;
}

.outils_sec .outil_bloc .inner_txt {
    background-color: #fff;
    width: 100%;
    height: 100%;
}

.block .colmarg .readMore {
    font-size: 15px;
    padding-right: 25px;
    background: url(../img/readMoreGrey.png) no-repeat right;

    margin-top: 20px;

    display: inline-block;
}

.dossier_mois .block .colmarg[data-color='yellow'] {

    background: #fbbb06;

}

.dossier_mois .block .colmarg[data-color='mere_enfant'] {

    background: #8252ba;

}

.dossier_mois .block .colmarg[data-color='mere_enfant'] > span {

    background: url(../img/themes-icons/theme_mere_enfant_2.png) no-repeat left;
    background-size: 38px;

}

.dossier_mois .block .colmarg[data-color='blue'] {

    background: #2eb2c2;

    padding: 25px 50px;

}

.dossier_mois .block .colmarg[data-color='blue'] > span {

    background: url(../img/icon-hygiene.png) no-repeat left;

}

.dossier_mois .block .colmarg[data-color='red'] {

    background: #b63b69;

    padding: 25px 50px;

}

.dossier_mois .block .colmarg[data-color='red'] > span {

    background: url(../img/icon-vaccin.png) no-repeat left;

}

.dossier_mois .block .colmarg[data-color='green'] > span {

    background: url(../img/icon-vie_saine.png) no-repeat left;

}

.dossier_mois .block .colmarg[data-color='green'] {

    background: #acc719;

    padding: 25px 56px;

}

.block .colmarg[data-has='color'],
.block.color .colmarg {

    color: white;

}

.block .colmarg[data-has='color'] > span,
.block.color .colmarg > span {

    padding-left: 45px;

    line-height: 3;

    display: block;

    height: 50px;

    font-size: 16px;

    margin-bottom: 20px;

}

.block .colmarg[data-has='color'] a,
.block.color .colmarg a {

    color: white;

    cursor: pointer;

}

.block .colmarg[data-has='bg'],
.block.blanc .colmarg {

    background: url(../img/motif_art.jpg) no-repeat left top #fff;

}

.block .colmarg[data-has='bg'] a.readMore,
.block.blanc .colmarg a.readMore {

    background: url(../img/readMoreGrey.png) no-repeat right;
    background-size: 18px;
    margin-top: 20px;
    padding-right: 25px;
    display: inline-block;
    cursor: pointer;

}

.block .colmarg[data-has='image'] img {

    width: 100%;

}

.block .colmarg[data-has='image'] a {

    background: url(../img/gradient.png) repeat-x left bottom;

    width: 100%;

    height: 100%;

    display: block;

    position: absolute;

    top: 0;

    left: 0;

}

.block .colmarg[data-has='image'] h3 {

    position: absolute;

    bottom: 0;

    margin: 30px 50px;

    color: white;

    padding-left: 40px

}

.dossier_mois .block .colmarg h3 {

    /*margin-bottom: 20px;*/

    text-align: left;
    font-family: 'lato';
    font-weight: 500;
    font-size: 1.2em;

}

/*************************************3éme piste***************************************************/

#home-v2 .container {
    overflow-y: auto
}

.la-une {

    background-color: #fff;

    /*background-image: url(../img/bg.png);*/

    background-repeat: no-repeat;

    background-position: 0px 100px;

    width: 98%;

    margin: 0 auto;

}

.c_la-une {

    background-color: #fff;

    width: 86%;

    margin: 0 auto;

}

h3.title-actu {

    color: #26a742;

    font-weight: 400;

    font-size: 1.3vw;

    padding: 5vh 0 3vh;

}

.sep-actu {

    border-right: 2px solid #dbdada;

    border-left: 2px solid #dbdada;

}

.clear {

    clear: both;

}

.carousel-control.left, .carousel-control.right {
    background-image: none;
}

.carousel-control {
    color: #c2c2c2;
    width: 5%;
    text-shadow: none;
}

.carousel-control:hover {
    color: #c2c2c2;
    width: 5%;
}

.sec_conex, .sec_themes, .sec_portail, .la-une, .footer, .sec_numeros {
    width: 95%;
    margin: 0 auto;
    padding: 30px 20px;
}

.sec_conex {
    background: url(../img/cn_bg.jpg) no-repeat right top #26a743;
    color: white
}

.sec_conex h3 {
    text-transform: uppercase;
    font-size: 1.2em;
    font-family: 'raleway', sans serif;
    line-height: 2;
}

.sec_conex p {
    color: #125c23;
}

.sec_conex > div {
    text-align: center;
    width: 60%;
    margin: 30px auto;
}

.sec_conex > div > a {
    padding-top: 100px;
    display: block;
    cursor: pointer;
    color: white
}

.sec_conex > div > a.cn_facebook {
    background: url(../img/cn_facebook.png) no-repeat top;
}

.sec_conex > div > a.cn_mobile {
    background: url(../img/cn_mobile.png) no-repeat top;
}

.sec_conex > div > a.cn_newsletter {
    background: url(../img/cn_newsletter.png) no-repeat top;
}

.sec_themes {
    background-color: #fff;
}

.sec_themes > p > span {
    color: #64943a;
    font-weight: bold;
}

.slice_theme h4 {
    padding-top: 15px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    font-size: 1.1em;
    font-weight: 500;
}

.slice_theme a {
    color: #a2a940;
    font-weight: bold;
    font-size: 0.9em;
    cursor: pointer;
}

.slice_theme p {
    line-height: 1.3;
    font-size: 0.9em;
}

.sec_portail {
    background-color: #fbfbfb;
}

.sec_portail h3, .la-une h3, .sec_themes h3 {
    color: #26a742;
    font-size: 1.4em;
    line-height: 2;
}

.sec_portail h3::after, .sec_themes h3::after {
    content: '';
    width: 65px;
    height: 1px;
    background-color: #26a742;
    position: relative;
    margin: 10px auto;
    display: block;
}

.sec_portail p {
    margin: 25px auto;
    width: 80%
}

.sec_portail a.goto {
    display: block;
    width: 50px;
    height: 50px;
    margin: 0 auto;
    background: url(../img/goto_arrow.png) no-repeat center;
    cursor: pointer;
}

.footer {
    background-color: #fff;
    margin-bottom: 30px;
}

.footer ul {
    list-style: none
}

.footer ul li {
    display: inline-block;
    font-family: 'raleway', sans serif;
    margin: 0 25px;
}

.footer ul li a {
    color: #333e36;
    cursor: pointer;
    font-size: 0.9em;
    font-weight: 400;
}

#myCarousel .block_art {
    padding: 8px;
}

#myCarousel .block_art > div {
    background-color: grey;
    height: 18vw;
    overflow: hidden;
    position: relative;
    color: white;
}

#myCarousel .block_art > div .inner {
    padding: 30px 40px;
    text-align: left;
}

#myCarousel .block_art > div .inner span {
    font-weight: 500;
    font-size: 18px;
}

#myCarousel .block_art > div .inner h3 {
    font-weight: 600;
    margin: 20px 0;
    font-family: 'raleway';
}

#myCarousel .block_art > div .inner p {
    font-size: 15px;
}

#myCarousel .block_art img {
    width: 100%;
}

#myCarousel .block_art svg {
    width: 40%;
    height: 90%;
    opacity: 0.3;
}

#myCarousel .block_art h4 {
    color: white;

    font-size: 18px;

    font-weight: 500;

    position: absolute;

    bottom: 20px;
    width: 100%;
    padding: 0 20px;
    text-align: center
}

#slide1 .block_art:nth-child(1) > div {
    background-color: #d49424;
}

#slide1 .block_art:nth-child(3) > div {
    background-color: #8faf00;
}

#slide1 .block_art:nth-child(5) > div {
    background-color: #2b94ad;
}

#slide2 .block_art:nth-child(2) > div {
    background-color: #fff;
    color: #38403a
}

#slide2 .block_art:nth-child(2) > div .inner span {
    color: #92a23a
}

.corner {
    display: block;
    width: calc(100% - 30px);
    height: calc(100% - 30px);
    margin: 15px;
    background: url(../img/corner.png) no-repeat right top;
    position: absolute;
    z-index: 3;
    cursor: pointer;
}

#home_imc #imc {
    padding-top: 0;
}

::-webkit-input-placeholder {

    padding-left: 10px;

}

:-moz-placeholder { /* Firefox 18- */

    padding-left: 10px;

}

::-moz-placeholder { /* Firefox 19+ */

    padding-left: 10px;

}

:-ms-input-placeholder {

    padding-left: 10px;

}

#imc input[type="number"] {
    height: 40px;
    border-radius: 4px;
    border: 0;
    margin-right: 5px;
    width: 150px;
}

#home_imc .res_imc, #home_imc #avis {
    color: #48670d;
    text-align: left;
    font-size: 15px;
    font-weight: 500
}

#home_imc .res_imc span {
    font-size: 48px;
    line-height: 60px;
}

#home_imc .resultat {
    width: 50%;
    margin: 50px 0 0 0;
}

/************************************* a propos ***************************************************/

/*.sec_apropos {
    width: 95%;
    margin: 0 auto;
    padding: 30px 20px;
    background: #fff;
    margin-top: 20px;
}

.sec_apropos h3, .sec_numeros h3 {
    color: #26a742;
    font-size: 1.4em;
    line-height: 2;
    margin: 20px 0;
    text-align: center
}

.sec_apropos h3::after, .sec_numeros h3::after {
    content: '';
    width: 65px;
    height: 1px;
    background-color: #26a742;
    position: relative;
    margin: 10px auto;
    display: block;
}*/

.themes-slider {
    padding: 0 70px;
    position: relative;
    margin: 40px 0;
}

.dialog {

    visibility: hidden;

    opacity: 0;

}

.dialog.dialog--open {

    visibility: visible;

    opacity: 1;

}

.actu a {
    color: rgb(107, 107, 107)
}

/*************** Fin home.css **************************/

/************** video *********************/

/* --------------------------------



Patterns - reusable parts of our design



-------------------------------- */

.cd-btn {

    display: inline-block;

    padding: 1.4em 2em;

    border-radius: 50em;

    background-color: #eebb00;

    box-shadow: 0 1px 20px rgba(238, 187, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.4);

    color: #ffffff;

    font-size: 1.3rem;

    font-weight: bold;

    text-transform: uppercase;

    letter-spacing: 1px;

    -webkit-transition: box-shadow 0.2s;

    -moz-transition: box-shadow 0.2s;

    transition: box-shadow 0.2s;

}

.no-touch .cd-btn:hover {

    box-shadow: 0 1px 30px rgba(238, 187, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.4);

}

.cd-img-replace {

    /* replace text with image */

    color: transparent;

    overflow: hidden;

    text-indent: 100%;

    white-space: nowrap;

}

/* --------------------------------



Intro page



-------------------------------- */

.cd-intro-block {

    position: relative;

    z-index: 2;

    height: 100vh;

    width: 100%;

    background-color: #262f3b;

    /* used to vertical align its content */

    display: table;

    -webkit-transition: -webkit-transform 0.5s;

    -moz-transition: -moz-transform 0.5s;

    transition: transform 0.5s;

    -webkit-transition-timing-function: cubic-bezier(0.67, 0.15, 0.83, 0.83);

    -moz-transition-timing-function: cubic-bezier(0.67, 0.15, 0.83, 0.83);

    transition-timing-function: cubic-bezier(0.67, 0.15, 0.83, 0.83);

}

.cd-intro-block::after {

    /* arrow icon visible when .cd-intro-block slides out */

    content: '';

    position: absolute;

    left: 50%;

    top: 50%;

    bottom: auto;

    right: auto;

    -webkit-transform: translateX(-50%) translateY(-50%);

    -moz-transform: translateX(-50%) translateY(-50%);

    -ms-transform: translateX(-50%) translateY(-50%);

    -o-transform: translateX(-50%) translateY(-50%);

    transform: translateX(-50%) translateY(-50%);

    top: 95%;

    height: 24px;

    width: 24px;

    background: url(http://jeunesreporters.org.ma/images/cd-arrow-back.svg) no-repeat center center;

    opacity: 0;

    -webkit-transition: opacity 0.2s;

    -moz-transition: opacity 0.2s;

    transition: opacity 0.2s;

}

.cd-intro-block .content-wrapper {

    /* vertical align the .cd-intro-block content */

    display: table-cell;

    vertical-align: middle;

    text-align: center;

}

.cd-intro-block h1 {

    width: 90%;

    margin: 0 auto .6em;

    font-size: 2.4rem;

    color: #ebebeb;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}

.cd-intro-block.projects-visible {

    /* translate the .cd-intro-block element to reveal the projects slider */

    -webkit-transform: translateY(-90%);

    -moz-transform: translateY(-90%);

    -ms-transform: translateY(-90%);

    -o-transform: translateY(-90%);

    transform: translateY(-90%);

    box-shadow: 0 4px 40px rgba(0, 0, 0, 0.6);

    cursor: pointer;

}

.cd-intro-block.projects-visible:after {

    /* show arrow icon */

    opacity: 1;

}

@media only screen and (min-width: 900px) {

    .cd-intro-block::after {

        top: 97.5%;

    }

    .cd-intro-block h1 {

        font-size: 4.4rem;

        font-weight: 300;

    }

    .cd-intro-block.projects-visible {

        -webkit-transform: translateY(-95%);

        -moz-transform: translateY(-95%);

        -ms-transform: translateY(-95%);

        -o-transform: translateY(-95%);

        transform: translateY(-95%);

    }

}

/* --------------------------------



Projects Slider



-------------------------------- */

.cd-projects-wrapper {

    height: 100%;

    -moz-transition: visibility 0s 0.5s;

}

.cd-projects-wrapper::before {

    /* never visible - this is used in jQuery to check the current MQ */

    content: 'mobile';

    display: none;

}

.cd-projects-wrapper.projects-visible {

    -moz-transition: visibility 0s 0s;

}

@media only screen and (min-width: 900px) {

    .cd-projects-wrapper::before {

        /* never visible - this is used in jQuery to check the current MQ */

        content: 'desktop';

    }

}

.cd-slider {

    padding-top: 10vh;

    height: 70%;

    overflow-y: auto;

}

.projects-visible .cd-slider {

    /* smooth scrolling on iOS */

    -webkit-overflow-scrolling: touch;
    overflow: visible;

}

.cd-slider li {

    margin: 4%;

    opacity: 0;

    border-radius: .25em;

    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);

    -webkit-transition: opacity 0s 0.5s;

    -moz-transition: opacity 0s 0.5s;

    transition: opacity 0s 0.5s;

    /* Force hardware acceleration */

    -webkit-transform: translateZ(0);

    -moz-transform: translateZ(0);

    -ms-transform: translateZ(0);

    -o-transform: translateZ(0);

    transform: translateZ(0);

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden;

}

.cd-slider li.slides-in {

    -webkit-transition: opacity 0s 0s;

    -moz-transition: opacity 0s 0s;

    transition: opacity 0s 0s;

    opacity: 1;

    -webkit-animation: cd-translate 0.5s;

    -moz-animation: cd-translate 0.5s;

    animation: cd-translate 0.5s;

}

.cd-slider a {

    display: block;

    height: 100%;

    width: 100%;

}

.cd-slider img {

    display: block;

    border-radius: .25em .25em 0 0;

    width: 100%;

}

.cd-slider .project-info {

    padding: 1em 1.6em;

    background-color: #ebebeb;

    border-radius: 0 0 .25em .25em;

}

.cd-slider h2 {

    font-size: 1.2vw;

    font-weight: bold;

    line-height: 1.2;
    font-family: 'DinnextRegular';

}

.caption {
    font-family: 'DinnextRegular';
}

.cd-slider p {

    font-size: 1.4rem;

    opacity: .6;

    padding: .4em 0;

    /* truncate text with ellipsis if too long */

    overflow: hidden;

    text-overflow: ellipsis;

}

.cd-slider h2, .cd-slider p {

    line-height: 1.2;

    color: #0f1926;

}

@media only screen and (max-width: 700px) {

    .cd-slider h2 {

        font-size: 4vw;

    }
}

@media only screen and (min-width: 700px) and (max-width: 900px) {

    .cd-slider h2 {

        font-size: 4vw;

    }
}

@media only screen and (min-width: 900px) {

    .cd-slider {

        padding: 0;

        overflow: visible;

        -webkit-transition: -webkit-transform 0.5s;

        -moz-transition: -moz-transform 0.5s;

        transition: transform 0.5s;

        /* Force hardware acceleration */

        -webkit-transform: translateZ(0);

        -moz-transform: translateZ(0);

        -ms-transform: translateZ(0);

        -o-transform: translateZ(0);

        transform: translateZ(0);

        -webkit-backface-visibility: hidden;

        backface-visibility: hidden;

    }

    .cd-slider::after {

        clear: both;

        content: "";

        display: table;

    }

    .cd-slider li {

        position: relative;

        float: left;

        width: 26vw;

        margin: 0 0 0 2vw;

        top: 50%;

        -webkit-transform: translateX(400%) translateY(-10%) rotate(-10deg);

        -moz-transform: translateX(400%) translateY(-10%) rotate(-10deg);

        -ms-transform: translateX(400%) translateY(-10%) rotate(-10deg);

        -o-transform: translateX(400%) translateY(-10%) rotate(-10deg);

        transform: translateX(400%) translateY(-10%) rotate(-10deg);

        -webkit-transition: opacity 0s 0.3s, -webkit-transform 0s 0.3s;

        -moz-transition: opacity 0s 0.3s, -moz-transform 0s 0.3s;

        transition: opacity 0s 0.3s, transform 0s 0.3s;

    }

    .cd-slider li:first-of-type {

        margin-left: 9vw;

    }

    .act-inner-content h2 {
        text-shadow: none;
    }

    .cd-slider li.slides-in:first-of-type {

        /* change transition duration/delay for the entrance animation */

        -webkit-transition: -webkit-transform 0.55s 0s;

        -moz-transition: -moz-transform 0.55s 0s;

        transition: transform 0.55s 0s;

    }

    .cd-slider li.slides-in:nth-of-type(2) {

        -webkit-transition: -webkit-transform 0.53s 0.05s;

        -moz-transition: -moz-transform 0.53s 0.05s;

        transition: transform 0.53s 0.05s;

    }

    .cd-slider li.slides-in:nth-of-type(3) {

        -webkit-transition: -webkit-transform 0.5s 0.1s;

        -moz-transition: -moz-transform 0.5s 0.1s;

        transition: transform 0.5s 0.1s;

    }

    .cd-slider li.slides-in:nth-of-type(4) {

        -webkit-transition: -webkit-transform 0.48s 0.15s;

        -moz-transition: -moz-transform 0.48s 0.15s;

        transition: transform 0.48s 0.15s;

    }

    .cd-slider.next li.current {

        /* next slide animation */

        -webkit-animation: cd-slide-1 0.5s;

        -moz-animation: cd-slide-1 0.5s;

        animation: cd-slide-1 0.5s;

    }

    .cd-slider.next li.current + li {

        -webkit-animation: cd-slide-2 0.5s;

        -moz-animation: cd-slide-2 0.5s;

        animation: cd-slide-2 0.5s;

    }

    .cd-slider.next li.current + li + li {

        -webkit-animation: cd-slide-3 0.5s;

        -moz-animation: cd-slide-3 0.5s;

        animation: cd-slide-3 0.5s;

    }

    .cd-slider.next li.current + li + li + li + li {

        -webkit-animation: cd-slide-4 0.5s;

        -moz-animation: cd-slide-4 0.5s;

        animation: cd-slide-4 0.5s;

    }

    .cd-slider.next li.current + li + li + li + li + li {

        -webkit-animation: cd-slide-5 0.5s;

        -moz-animation: cd-slide-5 0.5s;

        animation: cd-slide-5 0.5s;

    }

    .cd-slider.next li.current + li + li + li + li + li ~ li {

        -webkit-animation: cd-slide-6 0.5s;

        -moz-animation: cd-slide-6 0.5s;

        animation: cd-slide-6 0.5s;

    }

    .cd-slider.prev li {

        /* previous slide animation */

        -webkit-animation: cd-slide-7 0.5s;

        -moz-animation: cd-slide-7 0.5s;

        animation: cd-slide-7 0.5s;

    }

    .cd-slider.prev li.previous {

        /* previous slide animation - the previous class is used to target the slide which was visible right before the current one */

        -webkit-animation: cd-slide-1 0.5s;

        -moz-animation: cd-slide-1 0.5s;

        animation: cd-slide-1 0.5s;

    }

    .cd-slider.prev li.previous + li {

        -webkit-animation: cd-slide-2 0.5s;

        -moz-animation: cd-slide-2 0.5s;

        animation: cd-slide-2 0.5s;

    }

    .cd-slider.prev li.previous + li + li {

        -webkit-animation: cd-slide-3 0.5s;

        -moz-animation: cd-slide-3 0.5s;

        animation: cd-slide-3 0.5s;

    }

    .cd-slider.prev li.current + li {

        -webkit-animation: cd-slide-4 0.5s;

        -moz-animation: cd-slide-4 0.5s;

        animation: cd-slide-4 0.5s;

    }

    .cd-slider.prev li.current + li + li {

        -webkit-animation: cd-slide-5 0.5s;

        -moz-animation: cd-slide-5 0.5s;

        animation: cd-slide-5 0.5s;

    }

    .cd-slider.prev li.current, .cd-slider.prev li.current + li + li ~ li {

        -webkit-animation: none;

        -moz-animation: none;

        animation: none;

    }

}

@-webkit-keyframes cd-slide-1 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(-85%);

    }

}

@-moz-keyframes cd-slide-1 {

    0%, 100% {

        -moz-transform: translateY(-50%);

    }

    50% {

        -moz-transform: translateY(-50%) translateX(-85%);

    }

}

@keyframes cd-slide-1 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

        -moz-transform: translateY(-50%);

        -ms-transform: translateY(-50%);

        -o-transform: translateY(-50%);

        transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(-85%);

        -moz-transform: translateY(-50%) translateX(-85%);

        -ms-transform: translateY(-50%) translateX(-85%);

        -o-transform: translateY(-50%) translateX(-85%);

        transform: translateY(-50%) translateX(-85%);

    }

}

@-webkit-keyframes cd-slide-2 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(-55%);

    }

}

@-moz-keyframes cd-slide-2 {

    0%, 100% {

        -moz-transform: translateY(-50%);

    }

    50% {

        -moz-transform: translateY(-50%) translateX(-55%);

    }

}

@keyframes cd-slide-2 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

        -moz-transform: translateY(-50%);

        -ms-transform: translateY(-50%);

        -o-transform: translateY(-50%);

        transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(-55%);

        -moz-transform: translateY(-50%) translateX(-55%);

        -ms-transform: translateY(-50%) translateX(-55%);

        -o-transform: translateY(-50%) translateX(-55%);

        transform: translateY(-50%) translateX(-55%);

    }

}

@-webkit-keyframes cd-slide-3 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(-23%);

    }

}

@-moz-keyframes cd-slide-3 {

    0%, 100% {

        -moz-transform: translateY(-50%);

    }

    50% {

        -moz-transform: translateY(-50%) translateX(-23%);

    }

}

@keyframes cd-slide-3 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

        -moz-transform: translateY(-50%);

        -ms-transform: translateY(-50%);

        -o-transform: translateY(-50%);

        transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(-23%);

        -moz-transform: translateY(-50%) translateX(-23%);

        -ms-transform: translateY(-50%) translateX(-23%);

        -o-transform: translateY(-50%) translateX(-23%);

        transform: translateY(-50%) translateX(-23%);

    }

}

@-webkit-keyframes cd-slide-4 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(23%);

    }

}

@-moz-keyframes cd-slide-4 {

    0%, 100% {

        -moz-transform: translateY(-50%);

    }

    50% {

        -moz-transform: translateY(-50%) translateX(23%);

    }

}

@keyframes cd-slide-4 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

        -moz-transform: translateY(-50%);

        -ms-transform: translateY(-50%);

        -o-transform: translateY(-50%);

        transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(23%);

        -moz-transform: translateY(-50%) translateX(23%);

        -ms-transform: translateY(-50%) translateX(23%);

        -o-transform: translateY(-50%) translateX(23%);

        transform: translateY(-50%) translateX(23%);

    }

}

@-webkit-keyframes cd-slide-5 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(55%);

    }

}

@-moz-keyframes cd-slide-5 {

    0%, 100% {

        -moz-transform: translateY(-50%);

    }

    50% {

        -moz-transform: translateY(-50%) translateX(55%);

    }

}

@keyframes cd-slide-5 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

        -moz-transform: translateY(-50%);

        -ms-transform: translateY(-50%);

        -o-transform: translateY(-50%);

        transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(55%);

        -moz-transform: translateY(-50%) translateX(55%);

        -ms-transform: translateY(-50%) translateX(55%);

        -o-transform: translateY(-50%) translateX(55%);

        transform: translateY(-50%) translateX(55%);

    }

}

@-webkit-keyframes cd-slide-6 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(65%);

    }

}

@-moz-keyframes cd-slide-6 {

    0%, 100% {

        -moz-transform: translateY(-50%);

    }

    50% {

        -moz-transform: translateY(-50%) translateX(65%);

    }

}

@keyframes cd-slide-6 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

        -moz-transform: translateY(-50%);

        -ms-transform: translateY(-50%);

        -o-transform: translateY(-50%);

        transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(65%);

        -moz-transform: translateY(-50%) translateX(65%);

        -ms-transform: translateY(-50%) translateX(65%);

        -o-transform: translateY(-50%) translateX(65%);

        transform: translateY(-50%) translateX(65%);

    }

}

@-webkit-keyframes cd-slide-7 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(-95%);

    }

}

@-moz-keyframes cd-slide-7 {

    0%, 100% {

        -moz-transform: translateY(-50%);

    }

    50% {

        -moz-transform: translateY(-50%) translateX(-95%);

    }

}

@keyframes cd-slide-7 {

    0%, 100% {

        -webkit-transform: translateY(-50%);

        -moz-transform: translateY(-50%);

        -ms-transform: translateY(-50%);

        -o-transform: translateY(-50%);

        transform: translateY(-50%);

    }

    50% {

        -webkit-transform: translateY(-50%) translateX(-95%);

        -moz-transform: translateY(-50%) translateX(-95%);

        -ms-transform: translateY(-50%) translateX(-95%);

        -o-transform: translateY(-50%) translateX(-95%);

        transform: translateY(-50%) translateX(-95%);

    }

}

/* --------------------------------



Project slider navigation



-------------------------------- */

.cd-slider-navigation {

    display: none;

}

.cd-slider-navigation a {

    position: absolute;

    top: 40vh;

    bottom: auto;

    -webkit-transform: translateY(-50%);

    -moz-transform: translateY(-50%);

    -ms-transform: translateY(-50%);

    -o-transform: translateY(-50%);

    transform: translateY(-50%);

    left: 0;

    height: 60px;

    width: 4%;

    background: url(http://jeunesreporters.org.ma/images/cd-arrow.svg) no-repeat center center #000;

    -webkit-transition: opacity 0.2s 0s, visibility 0s 0s;

    -moz-transition: opacity 0.2s 0s, visibility 0s 0s;

    transition: opacity 0.2s 0s, visibility 0s 0s;

}

.cd-slider-navigation a.next {

    right: 0;

    left: auto;

}

.cd-slider-navigation a.prev {

    -webkit-transform: translateY(-50%) rotate(180deg);

    -moz-transform: translateY(-50%) rotate(180deg);

    -ms-transform: translateY(-50%) rotate(180deg);

    -o-transform: translateY(-50%) rotate(180deg);

    transform: translateY(-50%) rotate(180deg);

}

.cd-slider-navigation a.inactive {

    visibility: hidden;

    opacity: 0;

    -webkit-transition: opacity 0.2s 0s, visibility 0s 0.2s;

    -moz-transition: opacity 0.2s 0s, visibility 0s 0.2s;

    transition: opacity 0.2s 0s, visibility 0s 0.2s;

}

@media only screen and (min-width: 900px) {

    .cd-slider-navigation {

        display: block;

    }

}

/* --------------------------------



Project content panel



-------------------------------- */

.cd-project-content {

    position: fixed;

    z-index: 3;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    visibility: hidden;

    background-color: #ebebeb;

    /* Force Hardware Acceleration */

    -webkit-transform: translateZ(0);

    -moz-transform: translateZ(0);

    -ms-transform: translateZ(0);

    -o-transform: translateZ(0);

    transform: translateZ(0);

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden;

    -webkit-transform: translateY(100%);

    -moz-transform: translateY(100%);

    -ms-transform: translateY(100%);

    -o-transform: translateY(100%);

    transform: translateY(100%);

    -webkit-transition: -webkit-transform 0.4s 0s, visibility 0s 0.4s;

    -moz-transition: -moz-transform 0.4s 0s, visibility 0s 0.4s;

    transition: transform 0.4s 0s, visibility 0s 0.4s;

    -webkit-transition-timing-function: cubic-bezier(0.67, 0.15, 0.83, 0.83);

    -moz-transition-timing-function: cubic-bezier(0.67, 0.15, 0.83, 0.83);

    transition-timing-function: cubic-bezier(0.67, 0.15, 0.83, 0.83);

}

.cd-project-content > div {

    height: 100%;

    overflow-y: auto;

    padding: 4em 2em;

    padding-top: 180px;

}

.cd-project-content > div > * {

    max-width: 960px;

    margin-left: auto;

    margin-right: auto;

}

.cd-project-content.is-visible {

    visibility: visible;

    -webkit-transform: translateY(0);

    -moz-transform: translateY(0);

    -ms-transform: translateY(0);

    -o-transform: translateY(0);

    transform: translateY(0);

    -webkit-transition: -webkit-transform 0.4s 0s, visibility 0s 0s;

    -moz-transition: -moz-transform 0.4s 0s, visibility 0s 0s;

    transition: transform 0.4s 0s, visibility 0s 0s;

    -webkit-transition-timing-function: cubic-bezier(0.67, 0.15, 0.83, 0.83);

    -moz-transition-timing-function: cubic-bezier(0.67, 0.15, 0.83, 0.83);

    transition-timing-function: cubic-bezier(0.67, 0.15, 0.83, 0.83);

}

.cd-project-content.is-visible > div {

    /* smooth scrolling on iOS */

    -webkit-overflow-scrolling: touch;

}

.cd-project-content h2 {

    font-size: 2.4rem;

    font-weight: bold;

}

.cd-project-content em {

    display: block;

    font-size: 1.8rem;

    text-align: center;

    font-style: normal;

    margin: 10px auto;

}

.cd-project-content p {

    margin-bottom: 1em;

    font-size: 1.4rem;

    color: #6f757c;

}

.cd-project-content em, .cd-project-content p {

    line-height: 1.6;

}

.cd-project-content .close {

    display: block;

    height: 32px;

    width: 32px;

    position: absolute;

    top: 10px;

    right: 10px;

    background: url(http://jeunesreporters.org.ma/images/cd-close-dark.svg) no-repeat center center;

}

.cd-projects-wrapper .title {
    color: #24A03D;
    margin-top: 140px;
    text-align: center
}

.cd-projects-wrapper .title h3 {
    font-weight: 100;
    font-size: 2.2em;
    line-height: 2;
}

.cd-projects-wrapper .title .line {
    width: 65px;
    height: 3px;
    background-color: #fff;
    margin: 30px auto;
    margin-bottom: 1vh
}

#years {
    height: 50px;

    width: 100%;

    position: absolute;

    bottom: 0;

    background-color: white;

    z-index: 1001;
    display: table;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

#years ul {
    display: table;

    height: 50px;

    margin: 0 auto;

    padding: 0;

    max-width: 1300px;
}

#years li {

    float: left;

    margin: 15px 18px;

}

#years li a {

    cursor: pointer;
    color: #333;
    font-weight: 500;

}

#years .current-y {

    color: #cd6035;
    font-weight: 600

}

@media only screen and (min-width: 900px) {

    .cd-project-content h2 {

        font-size: 4rem;

        text-align: center;

        font-weight: 400;

    }

    .cd-project-content p {

        font-size: 1.8rem;

        text-align: justify

    }

    .cd-project-content .close {

        top: 130px;

        right: 5%;

    }

}

/* --------------------------------



Keyframes



-------------------------------- */

@-webkit-keyframes cd-translate {

    0% {

        opacity: 0;

        -webkit-transform: translateY(100px);

    }

    100% {

        -webkit-transform: translateY(0);

        opacity: 1;

    }

}

@-moz-keyframes cd-translate {

    0% {

        opacity: 0;

        -moz-transform: translateY(100px);

    }

    100% {

        -moz-transform: translateY(0);

        opacity: 1;

    }

}

@keyframes cd-translate {

    0% {

        opacity: 0;

        -webkit-transform: translateY(100px);

        -moz-transform: translateY(100px);

        -ms-transform: translateY(100px);

        -o-transform: translateY(100px);

        transform: translateY(100px);

    }

    100% {

        -webkit-transform: translateY(0);

        -moz-transform: translateY(0);

        -ms-transform: translateY(0);

        -o-transform: translateY(0);

        transform: translateY(0);

        opacity: 1;

    }

}

.img h3 {
    text-align: center;
    line-height: 1;
    font-size: 1.5em;
    color: white;
    padding-top: 60px;
}

.img .line {
    width: 30px;
    height: 2px;
    background-color: white;
    margin: 20px auto;
}

.img p {
    margin: 0 auto;
    text-align: center;
    padding: 5px;
    color: white;
    font-size: 1.2em;
}

#top_menu ul li.active::before {
    content: '';
    bottom: 0;
    border: solid transparent;
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: transparent;
    border-bottom-color: #FFFFFF;
    border-width: 7px;
    z-index: 9999;
    left: calc(50% - 7px);
}

#videos .container, #outils .container {
    overflow: hidden
}

#videos .sec_numeros {
    padding: 0;
}

/************** fin video ******************/

.theme_content .content > div:first-child .block:nth-child(odd) .colmarg, .theme_content .content > div:nth-child(2) .block:nth-child(even) .colmarg, .theme_content .content > div:nth-child(3) .block:nth-child(odd) .colmarg {
    background: rgba(0, 0, 0, 0.3)
}

.theme_content .content > div:first-child .block:nth-child(even) .colmarg .readMore, .theme_content .content > div:nth-child(2) .block:nth-child(odd) .colmarg .readMore, .theme_content .content > div:nth-child(3) .block:nth-child(even) .colmarg .readMore {
    background: url(../img/readMoreGrey.png) no-repeat right;
    background-size: 18px
}

.theme_content .content > div:first-child .block:nth-child(odd) .colmarg a, .theme_content .content > div:nth-child(2) .block:nth-child(even) .colmarg a, .theme_content .content > div:nth-child(3) .block:nth-child(odd) .colmarg a, .block .colmarg[data-has="image"] a {
    color: white;
}

.theme_content .content > div:first-child .block:nth-child(odd) .colmarg a.readMore, .theme_content .content > div:nth-child(2) .block:nth-child(even) .colmarg a.readMore, .theme_content .content > div:nth-child(3) .block:nth-child(odd) .colmarg a.readMore, .block .colmarg[data-has="image"] a.readMore {
    background: url(../img/readMore.png) no-repeat right;
}

.theme_content .content > div:first-child .block:nth-child(odd) .colmarg a span {
    color: white !important
}

.alert {
    padding: 15px;
    border: 1px solid transparent;
    border-radius: 4px
}

.alert h4 {
    margin-top: 0;
    color: inherit
}

.alert > p, .alert > ul {
    margin-bottom: 0
}

.alert > p + p {
    margin-top: 5px
}

.alert-dismissable, .alert-dismissible {
    padding-right: 35px
}

.alert-dismissable .close, .alert-dismissible .close {
    position: relative;
    top: -2px;
    right: -21px;
    color: inherit
}

.modal, .modal-backdrop {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.alert-success {
    background-color: #abe7ed;
    border-color: #abe7ed;
    color: #27a4b0
}

.alert-success hr {
    border-top-color: #96e1e8
}

.alert-success .alert-link {
    color: #1d7d86
}

.alert-info {
    background-color: #e0ebf9;
    border-color: #e0ebf9;
    color: #327ad5
}

.alert-info hr {
    border-top-color: #caddf4
}

.alert-info .alert-link {
    color: #2462b0
}

.alert-warning {
    background-color: #f9e491;
    border-color: #f9e491;
    color: #c29d0b
}

.alert-warning hr {
    border-top-color: #f7de79
}

.alert-warning .alert-link {
    color: #927608
}

.alert-danger {
    background-color: #fbe1e3;
    border-color: #fbe1e3;
    color: #e73d4a
}

.alert-danger hr {
    border-top-color: #f8cace
}

.alert-danger .alert-link {
    color: #d71b29
}

.alert {
    border-width: 1px
}

.alert > p {
    margin: 0
}

.alert.alert-borderless {
    border: 0
}

.articles .col0 .block:nth-child(odd) .colmarg, .articles .col0 .block:nth-child(odd) .colmarg a, .articles .col2 .block:nth-child(even) .colmarg, .articles .col2 .block:nth-child(even) .colmarg a {
    color: white
}

.articles .col0 .block:nth-child(odd) .colmarg a.readMore, .articles .col2 .block:nth-child(even) .colmarg a.readMore {
    background: url(../img/readMore.png) no-repeat right;
}

.articles .theme_icon {
    margin-bottom: 25px
}

.articles .theme_icon img {
    width: 35px;
    vertical-align: bottom;
    margin-right: 10px;
}

.icon-facebook {
    background-image: url(../img/social.png);
    padding: 14px !important;
    background-size: contain;
    margin-top: 10px;
    margin-right: 15px;
}

.bg-icons {
    background: #e8e8e8 url(../img/bg-top-right.png) no-repeat right 0 !important;
    height: calc(100vh - 144px);
    width: calc(35%);
    z-index: 0;
    position: absolute;
    top: 44px;
    left: 0;
}

.post_content .content {
    overflow: auto
}

.post_content .content > div .section .block_text, .post_content .content > div .section .block_image {
    position: relative;
    float: right
}

.post_content .content .section .block_text {
    padding: 30px 80px;
}

.section:after {
    content: '';
    clear: both;
    display: block;
}

.block_image {
    opacity: 0;
    top: 144px !important;
    height: calc(100vh - 144px) !important;
    position: fixed !important;
    transition: opacity 0.2s linear !important;
}

.currentSec .block_image {
    opacity: 1 !important
}

.post_content .content .section .block_image {
    background: none !important;
}

body#article {
    overflow: hidden
}

.nav-is-visible .theme_content {
    top: 0 !important
}

.santejeunes {
    max-height: 500px !important;
    height: 38vw !important;
}

.santejeunes .name, .santejeunes .link_utile {
    position: absolute;
    bottom: 15px;
    left: 0;
    right: 0;
}

.santejeunes .name {
    height: 120px;
    width: 78%;
    margin: auto;
}

.icon-num {
    opacity: 0.5;
    margin: 20px;
}

.double {
    text-align: left
}

.double .name {
    margin-left: 55px;
    padding-top: 13px;
}

.double img.icon-num {
    float: left;
    position: absolute;
    left: 10px;
    top: 10px;
}

.double .logo {
    float: right;
    position: absolute;
    right: 40px;
    top: 25px;
    width: 100px;
}

.double .link_utile {
    float: right;
}

.double p {
    font-size: 0.9em;
    width: 70%;
    margin: 0;
    height: 52%;
}

.name {
    height: 38%;
    line-height: 20px;
}

.bottom_menu .navigation li:nth-child(2) {
    display: none !important
}

.support .wrap_img {
    width: 100%;
    max-height: 20vw;
    overflow: hidden
}

#bloc_outils a, #bloc_outils span {
    color: white !important
}

#bloc_outils.colmarg .readMore {
    background: url(../img/readMore.png) no-repeat right !important;
}

.blocks_cat .parcours a {
    background: transparent !important;
}

.overlay_slides {
    z-index: 2;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 27%, rgba(1, 1, 1, 0) 28%, rgba(38, 38, 38, 1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(27%, rgba(0, 0, 0, 0)), color-stop(28%, rgba(1, 1, 1, 0)), color-stop(100%, rgba(38, 38, 38, 1)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 27%, rgba(1, 1, 1, 0) 28%, rgba(38, 38, 38, 1) 100%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 27%, rgba(1, 1, 1, 0) 28%, rgba(38, 38, 38, 1) 100%);
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 27%, rgba(1, 1, 1, 0) 28%, rgba(38, 38, 38, 1) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 27%, rgba(1, 1, 1, 0) 28%, rgba(38, 38, 38, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#262626", GradientType=0);
}

.theme_tools {
    background-color: #2e75b9;
    padding: 10px 5px;
}

.jre .theme_tools {
    background-color: #27ae60;
}

.theme_tools h1 {
    color: white;
    font-family: Raleway;
    font-size: 20px;
    font-weight: 400;
    line-height: 26px;
    text-transform: uppercase;
    margin: 0;
    float: left;
}

.theme_tools i,
.btnarticlepos i {
    font-size: 16px;
}

.theme_tools a,
.btnarticlepos {
    color: #fffefe;
    font-family: Raleway;
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
    display: inline-block;
    float: right;
    text-shadow: none;
    opacity: 1 !important;
}

.theme_tools .container {
    background: none;
    float: none;
}

.block .categorie {
    font-family: 'raleway', sans-serif;
    display: block;
    position: absolute;
    right: -10px;
    background: #2E75B9;
    color: #fff;
    padding: 0 10px;
    font-size: 14px;
    top: 15px;
}

.jre .block .categorie {
    background: #27ae60;
}

.block .categorie:after {
    content: '';
    display: block;
    position: absolute;
    right: 1px;
    top: 25px;
    border-left: 5px solid transparent;
    width: 0px;
    height: 0px;
    border-top: 5px solid #11416F;
    border-bottom: 5px solid transparent;
    border-right: 5px solid #11416F;
    transform: rotate(270deg);
}

.forum .block .date {
    color: #8e8e8e;
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 26px;
    display: inline-block;
    position: absolute;
    bottom:20px;
    left:30px;
}
.forum .comments_count {
    position: absolute;
    right: 30px;
    bottom: 20px;
}

.forum .block .colmarg {
    padding: 30px;
    position: relative;
    background-color: white !important;
    text-align: left;
    box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.17);
    height:180px;
}

.forum .block h3 {
    color: #29292a;
    margin-bottom: 10px;
    margin-top: 10px;
}

.forum .block p {
    color: #3c3d3c;
    font-family: Raleway;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
}

.toolbare {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 43px;
    background-color: #d3d3d3;
}

.toolbare {
    background-color: #2e75b9;
    color: #fff;
}

.toolbare a {
    color: #fff;
}

.post_content.forum .content {
    height: calc(100vh - 100px) !important;
}

.forum.post_content .content .block_text.allwidth {
    width: calc(100% - 60px) !important;
    margin-left: 60px;
    padding: 70px;
    background-color: #fff;
}

.forum.post_content .content .block_text p.meta__date {
    margin-bottom: 0px;
}

.forum.post_content .content .block_text p {
    color: #212121 !important;
    font-size: 14px !important;
}

.block_text .meta__date {
    float: right;
}

.post_content.forum .content .section .block_text .toolbare a {
    color: #232323;
    font-family: 'raleway', sans-serif;
    font-size: 16px;
    font-weight: 400;
    float: right;
    display: block;
    line-height: 43px !important;
    margin-right: 20px;
    color: #fff;
}
.commentaires textarea {
    height: 63px;
    background-color: #ebebeb;
    border: 1px solid #b7b7b7;
    margin-bottom: 10px;
}

.commentaires input[type=submit] {
    height: 34px;
    background-color: #2e75b9;
    border: none;
    color: white;
    font-family: Raleway;
    font-size: 13px;
    font-weight: 400;
    color: #fff;
    float: right;
}

.commentaires {
    padding-top: 30px;
    margin-top: 30px;
    border-top: 1px solid rgba(0, 0, 0, .25);
}

.commentaires .commentaire {
    border-bottom: 1px solid rgba(0, 0, 0, .05);
    margin-bottom: 20px;
    padding: 10px 0;
}

.theme_content.forum .theme_tools a.close {
    margin-left: 15px;
    background-size: 80%;
    background-position: 50%;
    background-repeat: no-repeat;
    top: -9px;
    font-size: 0;
}

.commentaires .commentaire .avatar {
    width: 40px;
    height: 39px;
    border: 2px solid white;
    box-shadow: 0.5px 0.9px 3px rgba(0, 0, 0, 0.31);
    border-radius: 50%;
    margin: 0 auto;
    display: block;
}

.commentaires .commentaire .infos {
    color: #737373;
    font-family: "Raleway";
    font-size: 13px;
    font-weight: 400;
}

.commentaires .commentaire .infos span {
    color: #ed920f;
    font-weight: bold;
    font-size: 20px;
    display: inline-block;
    margin: 0 10px;
}

.commentaires .commentaire p {
    color: #212121;
    font-family: Raleway;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    margin-bottom: 0;
}

.commentaires .commentaire p.infos,
.post_content .content .block_text p.meta__date {
    margin-bottom: 0px;
}

.commentaires {
    padding-top: 30px;
    margin-top: 30px;
    border-top: 1px solid rgba(0, 0, 0, .25);
}

.commentaire {
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, .05);
}

.commentaires .commentaire {
    border-bottom: 1px solid rgba(0, 0, 0, .05);
    margin-bottom: 20px;
    padding: 10px 0;
}
.post_content .content .section .block_text i{
    display: inline-block;
}
.likes_count, .comments_count, .articles_count {
    color: #a0a0a0;
    font-family: Raleway;
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
    float: right;
    display: inline-block;
    text-align: center;
}
.forum .block .colmarg a:after{
    display: block;
    content: '';
    clear: both;
}
.forum .block .colmarg a {
    margin-bottom: 10px;
    display: block;
}

.commentaires input[type=file]{
    font-size: 14px;
}
.post_content .content .section .block_text .commentaire h4 {
    font-size: 14px;
    margin-bottom: 5px;
    border-bottom: 1px solid rgba(0,0,0,.2);
}
.post_content .content .section .block_text .commentaire a {
    font-size: 14px;
}
.header_info{
    margin-bottom: 4vw;
    position: relative;
    z-index: 5;
}
.infos_jour {
    background: #a9acaf !important;
    position: relative;
    padding: 25px 35px !important;
    min-height: 17vw;
    height: 30vh;
}
.header_info, .content_info {
    color: #fff;
}
.content_info {
    position: absolute;
    bottom: 30px;
    right: 30px;
    left: 30px;
    z-index: 3;
}
.content_info h3 {
    margin-bottom: 10px;
}
.moreInfos,.moreInfos:hover,.moreInfos:focus{
    color: #a2a940;
    background: url(../img/moreInfos.png) no-repeat left;
    padding: 10px 40px;
    float: right;
    font-weight: 400;
    font-size: 85%;
}
.no-padding img{
    padding: 0!important;
}
section.dossier_mois.infos_pratique {
    padding-bottom: 0;
    padding-top: 50px;
}
.post_content.active .content .section .block_text h1 {
    margin-top: 30px;
}
.read_more_top{
    position: absolute;
    right: 30px;
    top: 0;
}
section.dossier_mois.infos_pratique .block .colmarg h3{
    background: url(../img/readMore.png) no-repeat left 5px;
    padding-left: 35px;
    display: block;
    background-size: 18px;
}
.mobile img{
    margin: 0 0 0 20%;
}
#mobile_dialog .dialog__content {
    opacity: 1;
    background-color: #fff;
}

@media screen and (max-width: 640px) {
    section.dossier_mois.infos_pratique .block .colmarg h3{
        font-size: 18px;
        padding-left: 25px;
    }
    .read_more_top {
        position: relative;
        left: 10px;
        float: left;
    }
    .read_more_top a{
        float: left;
    }
    section.dossier_mois.infos_pratique .block .colmarg .content_info{
        right: 5px;
        left: 5px;
    }
}
/*******************Search bar*********************/
.animate {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.navbar-bootsnipp {
    z-index: 100;
}
.navbar-bootsnipp:nth-of-type(2) {
    z-index: 50
}

.navbar-bootsnipp.affix-top {
    position: absolute;
    top: 0;
    width: 100%;
}
.navbar-bootsnipp.affix {
    top: 0;
    width: 100%;
}
.navbar-bootsnipp .navbar-nav > li > form > .input-group > input,
.navbar-bootsnipp .navbar-nav > li > form > .input-group > .input-group-btn > .btn {
    border-radius: 0;
}
.navbar-bootsnipp .navbar-nav > li.disabled > a {
    color: rgb(200, 200, 200);
}
.navbar-bootsnipp .bootsnipp-search {
    display: none;
}
.navbar-bootsnipp .bootsnipp-search .form-control {
    background-color: rgb(235, 235, 235);
    border-radius: 0px;
    border-width: 0px;
    font-size: 24px;
    padding: 30px 0px;
}
.navbar-bootsnipp .bootsnipp-search .form-control {
    background-color: rgb(235, 235, 235);
    border-radius: 0px;
    border-width: 0px;
    font-size: 24px;
    padding: 25px 0px;
}
.navbar-bootsnipp .bootsnipp-search .form-control:focus {
    border-color: transparent;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.navbar-bootsnipp .bootsnipp-search .input-group-btn > .btn {
    padding: 14px 16px;
    border-radius: 0px;
}
.navbar-bootsnipp .bootsnipp-search .input-group-btn > .btn.active,
.navbar-bootsnipp .bootsnipp-search .input-group-btn > .btn:hover,
.navbar-bootsnipp .bootsnipp-search .input-group-btn > .btn:focus {
    padding: 14px 16px 14px 15px;
}
.navbar-bootsnipp .bootsnipp-search .input-group-btn > .btn-default {
    background-color: rgb(245, 245, 245);
}
.nav-padding {
    padding-top: 61px;
}
@media screen and (min-width: 768px) {
    .navbar-bootsnipp .navbar-brand {
        font-size: 20px;
        height: auto;
        padding: 15px 5px;
    }
    .navbar-bootsnipp .navbar-nav > li.disabled > a {
        padding-left: 10px;
        padding-right: 10px;
    }
    .navbar-bootsnipp .bootsnipp-search {
        background-color: rgb(235, 235, 235);
        display: block;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        -webkit-transform: rotateX(-90deg);
        -moz-transform: rotateX(-90deg);
        -o-transform: rotateX(-90deg);
        -ms-transform: rotateX(-90deg);
        transform: rotateX(-90deg);
        -webkit-transform-origin: 0 0 0;
        -moz-transform-origin: 0 0 0;
        -o-transform-origin: 0 0 0;
        -ms-transform-origin: 0 0 0;
        transform-origin: 0 0 0;
        visibility: hidden;
    }
    .navbar-bootsnipp .bootsnipp-search.open {
        -webkit-transform: rotateX(0deg);
        -moz-transform: rotateX(0deg);
        -o-transform: rotateX(0deg);
        -ms-transform: rotateX(0deg);
        transform: rotateX(0deg);
        visibility: visible;
    }
    .navbar-bootsnipp .bootsnipp-search > .container {
        padding: 0px;
    }
}
.block.col-md-4.col-sm-6.col-xs-12.active.white {
    padding: 10px;
}
/********************End search bar********************/