/*
Project   : Starter CSS
Author    : Pierre Hoang
Version   : v.1.0
Date      : 2026
*/
@font-face {
    font-family: 'open_sansregular';
    src: url('../fonts/open_Sans/opensans-regular-webfont.woff2') format('woff2'),
        url('../fonts/open_Sans/opensans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
 
@font-face {
    font-family: 'montserrat-medium';
    src: url('../fonts/montserrat/Montserrat-Medium.ttf') format('ttf');
    font-weight: normal;
    font-style: normal;

}
 
 

/*--------------------------------------------------------*/
/* GLOBAL */
/*--------------------------------------------------------*/
*, *:before, *:after {
    box-sizing: inherit;
}

html {
    box-sizing: border-box;
    font-size: 100%;
}
html, body{
    min-height: 100%;
}
body {
    position: relative;
    font-family: 'Open Sans', sans-serif;
   
    font-size: 1em;
    line-height: 1.5em;
    font-weight: 400;
    color: #222;
    background-color: #fff;
}

/* Typographie */
/*---------------------------------------*/
h1, .h1-like,
h2, .h2-like,
h3, .h3-like,
h4, .h4-like,
h5, .h5-like,
h6, .h6-like {

    color: #03588e;
    line-height: 1.25em;
    margin: 0 0 0.625em 0;
    font-family: 'montserrat-medium', sans-serif;

}
h1, .h1-like {
    font-size: 2em;
}

h2, .h2-like {
    font-size: 1.75em;
}
h3, .h3-like {
    font-size: 1.5em;
}
h4, .h4-like {
    font-size: 1.25em;
}
h5, .h5-like {
    font-size: 1.025em;
}
h6, .h6-like {
    font-size: 1em;
}
p {
    margin: 0 0 0.625em 0;
    font-size: 1em;
    line-height: 1.7em;
}
/* Links */
/*---------------------------------------*/
strong{
        color: #000;
        font-size: 1.1em
}
a {
    text-decoration: none;
    color: #03588e;
    transition: all 0.3s;
}
a:hover{
color: #1e97c9 ;
}
ul{
    list-style-type: disclosure-closed;
}

.italic {
  font-style: italic;
}

/* table */
/*---------------------------*/

tr,
td,
th {
    vertical-align: middle;
}
tbody td {
    padding: 0.5em;

}
table {
    width: 100%;
    margin: 0.625em 0;
    /*table-layout: fixed;*/
    border-collapse: collapse;
}
thead th {
    padding: 0.625em 0;
    border-bottom: 2px solid #c1c1c4;
    text-align: left;
    font-weight: 700;
}
tbody td {
    padding: 0.625em;
    border: 1px solid #c1c1c4;
}
tbody tr:nth-child(even) {
    background: #E7E7E7;
}
/* Forms */
/* -----------------------------------------------------*/
form ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
input,
label,
select {
    display: block;
    font-size: 1em;
    font-family: 'Open Sans', sans-serif;
}
label {
    margin-bottom: .35938em;
    font-weight: 700;
    cursor: pointer;
}
label.required:after {
    content: " *";
}
textarea,
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="time"],
input[type="week"],
select[multiple=multiple] {
    box-sizing: border-box;
    width: 100%;
    margin-bottom: .71875em;
    padding: .625em;
    border: 2px solid #e8e8e9;
    border-radius: 0;
    font-size: 1em;
    background-color: #fff;
    box-shadow: none;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
textarea:hover,
input[type="email"]:hover,
input[type="number"]:hover,
input[type="password"]:hover,
input[type="search"]:hover,
input[type="tel"]:hover,
input[type="text"]:hover,
input[type="url"]:hover,
input[type="color"]:hover,
input[type="date"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="month"]:hover,
input[type="time"]:hover,
input[type="week"]:hover,
select[multiple=multiple]:hover {
    border-color: #fd994d;
}
textarea:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="url"]:focus,
input[type="color"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
select[multiple=multiple]:focus {
    outline: none;
    border: 2px solid #fd994d;
    -webkit-box-shadow: 0 0 5px rgba(254, 152, 15, 0.5);
    -moz-box-shadow: 0 0 5px rgba(254, 152, 15, 0.5);
    box-shadow: 0 0 5px rgba(254, 152, 15, 0.5);
}

textarea {
    resize: vertical;
}
input[type="checkbox"],
input[type="radio"] {
    display: inline;
    margin-right: .71875em;
}

input[type="file"] {
    width: 100%;
    margin-bottom: .71875em;
    padding-bottom: .23958em;
}
input[type="submit"] {
    cursor: pointer;
    padding: 4px 13px;
}
select {
    width: auto;
    margin-bottom: .71875em;
    max-width: 100%;
}

fieldset {
    margin: 0 0 .71875em 0;
    padding: 1.4375em;
    border: 1px solid #e8e8e9;
    border-radius: 0;
    background: #fafafa;
}
::-webkit-input-placeholder {
    color: #c8c9ca;
}
:-moz-placeholder {
    color: #c8c9ca;
}

::-moz-placeholder {
    color: #c8c9ca;
}
:-ms-input-placeholder {
    color: #c8c9ca;
}
input[id="nom"], input[id="prenom"] {
    display: inline-block;
    width: 75%;
}
label[for="nom"], label[for="prenom"] {
    display: inline-block;
    width: 20%;
}
/* Grouping content */
/*---------------------------------------*/
img,
audio,
video {
    max-width: 100%;
    height: auto;
    vertical-align: top;
}
audio, video {
    vertical-align: bottom;
}
figure {
    margin: 0;
}
/* buttons */
/*---------------------------------------*/
.btn{
    position: relative;
    display: inline-block;
    color: #A62A31;
    background-color: #fff;
        
    border: 1px solid #A62A31;
    border-radius: 3px;
    padding: 0 1em;
    line-height: 2em;
    white-space: nowrap;
    -webkit-transition: all 0.3s ease-in-out ;
    transition: all 0.3s ease-in-out ;
}
.btn:hover {
    color: #fff;
    background-color: #A62A31;
     -webkit-transition: all 0.3s ease-in-out ;
    transition: all 0.3s ease-in-out ;
}
 
.btn--small {
    font-size: 0.75em;
}
.btn--large {
    font-size: 1.5em;
}
.btn--secondary {
    color: #fd994d;
    background-color:  #fff;
    font-size: 1.25em;
    position: relative;
    display: inline-block;

    border: 1px solid #fd994d;
    border-radius: 3px;
    padding: 0 0.5em;
    line-height: 2em;
    white-space: nowrap;
    -webkit-transition: all 0.3s ease-in-out ;
    transition: all 0.3s ease-in-out ;
}
.btn--secondary:hover {
      color: #fff;
    background-color: #fd994d;
     -webkit-transition: all 0.3s ease-in-out ;
    transition: all 0.3s ease-in-out ;
}

/*--------------------------------------------------------*/
/* GRID CSS */
/*--------------------------------------------------------*/
.grid:before,
.grid:after {
    display: block;
    content: "";
    clear: both;
}
.grid {
    margin-left: -10px;
    margin-right: -10px;
}
/* cible toutes les classes qui commencent par col- qui ont
un parent qui porte la classe grid  */
.grid [class*="col-"] {
    float: left;
    padding-left: 10px;
    padding-right: 10px;
}
.col-m-0 {width: 0%;}
.col-m-1 {width: 8.333%;}
.col-m-2 {width: 16.667%;}
.col-m-3 {width: 25%;}
.col-m-4 {width: 33.333%;}
.col-m-5 {width: 41.667%;}
.col-m-6 {width: 50%;}
.col-m-7 {width: 58.333%;}
.col-m-8 {width: 66.667%;}
.col-m-9 {width: 75%;}
.col-m-10 {width: 83.333%;}
.col-m-11 {width: 91.667%;}
.col-m-12 {width: 100%;}

/* grid tablet view */
/*--------------------------------------------------*/
@media (min-width: 480px) {

    .col-t-1 {width: 8.333%;}
    .col-t-2 {width: 16.667%;}
    .col-t-3 {width: 25%;}
    .col-t-4 {width: 33.333%;}
    .col-t-5 {width: 41.667%;}
    .col-t-6 {width: 50%;}
    .col-t-7 {width: 58.333%;}
    .col-t-8 {width: 66.667%;}
    .col-t-9 {width: 75%;}
    .col-t-10 {width: 83.333%;}
    .col-t-11 {width: 91.667%;}
    .col-t-12 {width: 100%;}


}/*--------------------------------------------------*/

/* grid desktop view */
/*--------------------------------------------------*/
@media (min-width: 769px) {

    .col-d-1 {width: 8.333%;}
    .col-d-2 {width: 16.667%;}
    .col-d-3 {width: 25%;}
    .col-d-4 {width: 33.333%;}
    .col-d-5 {width: 41.667%;}
    .col-d-6 {width: 50%;}
    .col-d-7 {width: 58.333%;}
    .col-d-8 {width: 66.667%;}
    .col-d-9 {width: 75%;}
    .col-d-10 {width: 83.333%;}
    .col-d-11 {width: 91.667%;}
    .col-d-12 {width: 100%;}

    .table {display: table; 
            width: 100%;

    }
    .fixed {		table-layout: fixed;	}
    .row {		display: table-row;	}
    .cell {
        display: table-cell;
        vertical-align: top;
    }
}
/*--------------------------------------------------*/
/* helpers */
/*---------------------------------------*/
.txt-center {
    text-align: center;
}
.txt-right {
    text-align: right;
}
.txt-left {
    text-align: left;
}
.v-top {
    vertical-align: top;
}
.v-middle {
    vertical-align: middle;
}
.v-bottom {
    vertical-align: bottom;
}
/*
m = margin
a, t, b = all, top, bottom
n, s, m, l = none, small, medium, large
*/

.man {margin: 0px !important;}
.mas {margin: 20px !important;}
.mam {margin: 40px !important;}
.mal {margin: 60px !important;}
.mtn {margin-top: 0px !important;}
.mts {margin-top: 20px !important;}
.mtm {margin-top: 40px !important;}
.mtl {margin-top: 60px !important;}
.mbn {margin-bottom: 0px !important;}
.mbs {margin-bottom: 20px !important;}
.mbm {margin-bottom: 40px !important;}
.mbl {margin-bottom: 60px !important;}
.mas--s{margin: 10px !important;}
.mbs--s{margin-bottom: 10px !important;}

/*========== padding=============*/
.pas{padding: 10px;}
.pam{padding: 20px;}
.ptn{padding-top:0px !important;}
.pts{padding-top: 10px!important;}
.ptm{padding-top: 20px!important;}
.ptl{padding-top: 30px!important;}

/*------ padding -bottom----------*/
.pbn{ padding-bottom: 0px !important;}
.pbs{padding-bottom: 10px!important;}
.pbm{padding-bottom: 20px!important;}
.pbl{padding-bottom: 30px!important;}
/*------ padding - left right----------*/

.plrs{
    padding-left: 10px!important;
    padding-right: 10px !important;
}
.mlrs{
    margin-left: 10px!important;
    margin-right: 10px !important;
}


/*---- autres-------*/
.center-box {
    margin-left: auto!important;
    margin-right: auto!important;
    float: none!important;
}

.center{
    margin-left: auto!important;
    margin-right: auto!important;
}
.round{	border-radius: 50%;}
.width-100{
    height: 100px;
    width: 100px;
    border-radius: 50%;
}
.display-block{
    display: block;
}

/*========= backgroud =============*/
 
.bg-eee{
    background-color: #eee;
}
.bg-fff{
    background-color: #fff;
}
 
.bg-000{
    background-color: #000;
}


.bg-666{
    background-color: #666;
}
 
 
.bg-vert{
    background-color: #7fde98;
}

.bg-bleu{
    background-color: #1e97c8;
}
.bg-bleu-claire{
    background-color: #5ADFF2;
}


.bg-jaune{
    background-color: #ffde59
}
.bg-orange-claire{
    background-color: #f7a817;
} 

.bg-orange{
    background-color: #fd994d;
}

 
.bg-menu{
    background-color: #1e97c8;
}
.bg-rouge{
    background-color: #fb4d65;
}
.bg-maron{
    background-color: #8e7d81;
}
 
 
.bg-footer{
    background-color: #1e97c8;
}
.bg-bleu-fonce{
    background-color: #243f6f;
}


/* -------- color de font -------- */
.color-eee{
    color: #eee;
}
.color-fff{
    color: #fff !important;
}
.color-bleu{
    color: #446CB3;
}
.color-orange{
  color: #fd994d;  
}
 
.overflow{
    overflow: hidden;
}
.border-bottom{
    border-bottom: 1px solid #E7E7E7 !important;
    width: auto;
}
.display-inline{
    display: inline; 
}
.vertical-middle{
    vertical-align: middle;
}
.border-right-left{
    border-right: 2px solid #fff;
    border-left: 2px solid #fff;
}
/* others */
/*---------------------------------------*/
.browsehappy {
    background-color: #5ab1ab;
    color: #324b4b;
    padding: 20px;
    margin: 20px 0;
    border: 10px solid;
    text-align: center;
}
.browsehappy a {
    color: #fff;
    text-decoration: underline;
}
.browsehappy a:hover {
    color: #fff;
    text-decoration: none;
}
.video {
    width: 100%    !important;
    height: auto   !important;
}
.videoWrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}
.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border:0;
}
 
.relative{
    position: relative;
}
.absolut{
    position: absolute;
}
/*Box Shadow - (Optional)*/
.box-shadow{
    -moz-box-shadow: 2px 2px 15px #999;
    -webkit-box-shadow: 2px 2px 15px #999;
    box-shadow: 2px 2px 15px #999;

}
.display-block{
    display: block;
}

.full{
    width: 100% !important;
}
.full img{
    width: 100% !important;
}
.clear{
    clear: both;
}
.overflow{
    overflow: hidden;
}

 .non-boucle li{
    list-style-type: none;
    float: left;
    padding: 5px;
}
.content ul li{
    float: left;
    padding: 5px;
    width: 100%;
}

.item, .item2 {
    position: relative;
    overflow: hidden !important;
/*    border-radius: 5px;*/
}
.item img {
    width: 100%;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
.item:hover img {
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
.item:hover .icon-play {
    color: #fd994d;
}
.item .icon-play {
    color: #fff;
    position: absolute;
    top: 45%;
    left: 45%;
    opacity: 1;
    transform: scale(1.5);
    transition: all 0.3s ease-in-out;
}

.item3:after {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: 0px ;
}
 
.item2 :after {
  position: absolute;
    content: '';
    width: 96%;
    height: 94%;
    top: 3%;
    left: 2%;
    border: 2px solid #fff;
  
}
 
.lien:hover {
 color: #eee;
 cursor: pointer;
}

/* -------- citations ---------- */
blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
.quote {
    font-family: Georgia, serif;
    font-size: 14px;
}

.curly-quotes:before, .curly-quotes:after {
    display: inline-block;
    vertical-align: top;
    height: 30px;
    line-height: 48px;
    font-size: 50px;
    opacity: .7;
}
blockquote p:before, .curly-quotes:before {
    content: '\201C';
    margin-right: 4px;
    margin-left: -8px;
}
blockquote p:after, .curly-quotes:after {
    content: '\201D';
    margin-left: 4px;
    margin-right: -8px;
}
.quote-by {
    display: block;
    padding-right: 50px;
    text-align: right;
    font-size: 13px;
    font-style: italic;
    color: #84775c;
}
.uppercase{
    text-transform: uppercase;
}

.tiltre{
    display: inline-block;
    border-bottom: 4px solid #fd994d;
}

/* ========== centent archive =============*/
 


/*-------------------------------*/
/*back  to top*/

.cd-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 10;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: rgba(177 43 45) url(../img/cd-top-arrow.svg) no-repeat center 50%;
    -webkit-transition: opacity .3s 0s, visibility 0s .3s;
    -moz-transition: opacity .3s 0s, visibility 0s .3s;
    transition: opacity .3s 0s, visibility 0s .3s;
    border-radius: 3px;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out,.cd-top:hover {
    -webkit-transition: opacity .3s 0s, visibility 0s 0s;
    -moz-transition: opacity .3s 0s, visibility 0s 0s;
    transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
    visibility: visible;
    opacity: 1;
}
.cd-top.cd-fade-out {
    opacity: .7;
}
.cd-top:hover {
    background-color: #fd994d;
    opacity: 1;
}

/*--------------------------------------------------------*/
/* CONTENT */
/*--------------------------------------------------------*/

.wrap {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 10px;
    padding-right: 10px;
    position: relative;

}
/* header */
/*---------------------------------------*/
#header {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99999;
    transition: all 0.3s;
    border-bottom: 2px solid #fff;

}

.scoll{
    padding:0 !important;
    transition: all 0.3s;
}
.logo{
    display: block;
    width: 50px;
}

.logo img, .logo-footer img{
    width: 100%;
    background-color: #fff;
    border-radius: 50%;
    padding: 5px;
}
.logo-footer{
    display: block;
    width: 150px;
}
.logo a:hover{
    cursor: pointer;
}

.h1-home{
    font-size: 0;
     width: 1px;
  height: 1px;
}

.ariane{
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: block;
}
.ariane li{
    display: inline-block;
    float: left;
}


.vignette {
    display: block;
    position: relative;
    width: 150px !important;
    height: 150px !important;
    margin-top: 20px !important;
    border: 7px solid #fff;
    border-radius: 50%;
    margin-left: auto!important;
    margin-right: auto!important;
    overflow: hidden;
    padding: 5px;
}

.vignette-icon {
    display: block;
    margin-top: -60px;
    width: 100px !important;
    height: 100px !important;
    border: 7px solid #fff;
    border-radius: 50%;
    margin-left: auto!important;
    margin-right: auto!important;
    overflow: hidden;
     transition: all 0.3s ease-in-out ;
     background-color: #fff;
}
.vignette-icon:hover {
    border: 10px solid #fff;
     transition: all 0.3s ease-in-out ;
}



.vignette-tittre {
  display: block;
    position: absolute;
    top: 40%;
    left: 0;
    width: 100%;
    text-align: center;
    transition: all 0.3s ease-in-out ;
    color: #fff;
}

.vignette:hover .vignette-tittre  {
color: #000 !important;
transition: all 0.3s ease-in-out ;
}
.text-shadow{
    color: white;
    text-shadow: 2px 2px 4px #000000;
} 

/*titre de catégorie*/ 

.titre-categorie{
    display:initial;
    color: #1e97c9;
    padding: 5px 10px;
    margin: 0px;
}
 
 .titre-categorie2 {
    display: initial;
    color: #fff;
    padding: 5px 10px;
    margin: 0px;
}
.titre-categorie4{
    display:initial;
    background-color: #fd994d;
    color: #fff;
    padding: 5px 10px;
    margin: 0px;
}
.hr4{
    display: block;
    border: 0px;
    border-bottom: 1px solid #fd994d;
    margin-top: 4px;
    margin-bottom:0;
}
.titre-categorie2 a, .titre-categorie4 a, .titre-categorie a{
    color: #fd994d;
}
.titre-categorie2 a:hover, .titre-categorie4 a:hover, .titre-categorie a:hover{
    color: brown;
}
 
.container{
        position: relative;
}


.hr{
    display: block;
    border: 0px;
    margin-top: 4px;
    margin-bottom:0;
}
.hr-orange{
    border-bottom: 1px solid #fd994d;
        
}
.hr-bleu{
    border-bottom: 1px solid #1e97c8;
        
}
.hr-center, .hr-left{
    border-bottom: 2px solid #fd994d;
    width: 50px;
    padding: 10px;
    margin-bottom: 10px;
}
.hr-left{
    float: left;
}
 

.bg-citation-sous{
    background-color: #59DFF2;
}

/* menu */
/*----------------- menu entete----------------------*/


.menu-entete ul {
    margin: 0;
    padding: 0;
    list-style-type: none !important;
/*    position:absolute;
    right: 20px;
    top: 10px;*/
}
.menu-entete  ul li{
    text-align: right;
    float: left;
    margin: 5px;
}
.menu-entete  a{
    display: block;
    padding: 0.5em;
    color: #fd994d;;
    font-size: 1em;
    background-color: #F3F1E7;
    border-bottom: 1px solid #eee;
    -webkit-transition: all 0.3s ease-in-out ;
    transition: all 0.3s ease-in-out ;
}
.menu-entete .current, 
.menu-entete  a:hover
{
    color: #fff;
    border-bottom: 1px solid #fd994d;
    background-color: #fd994d;
}

/*----------------- menu principale----------------------*/
.menu-principal {
    height: 0;
    opacity: 0;
    overflow: hidden;
   -moz-transition: height 1s ease;
  -webkit-transition: height 1s ease;
  -o-transition: height 1s ease;
  transition: height 1s ease;
}

.menu-principal-collapse {
    height: auto;
    opacity: 1;
     -moz-transition: height 1s ease;
  -webkit-transition: height 1s ease;
  -o-transition: height 1s ease;
  transition: height 1s ease;
}

.menu-principal ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.menu-principal ul li{
    text-align: left;

}
.menu-principal a{
    display: block;
    padding: 0.5em;
    color: #fff;
    font-size: 1em;
    /*background-color: #F3F1E7;*/
    border-bottom: 1px solid #eee;
    -webkit-transition: all 0.3s ease-in-out ;
    transition: all 0.3s ease-in-out ;
}
.menu-principal .current, 
.menu-principal a:hover
{
    color: #fd994d;
    border-bottom: 1px solid #fd994d;
    background-color:#87d6d9;
}
/* menu niveau 2*/
.menu-principal ul li ul{
    display: none;
    position: relative;
    height: auto;
    margin:0;
}
.menu-principal ul li ul li a{
    padding-left: 20px;
}
.menu-principal ul li ul li a:before{
    width: 0;
    height: 0;
    border: 0.4em solid transparent; /* 5 */
    border-right: none;
    border-left-color: transparent;
    content: '';
    vertical-align: middle;
    display: inline-block;
    position: relative;
    right: 0.25em;
        -webkit-transition: all 0.3s ease-in-out ;
    transition: all 0.3s ease-in-out 
}

.menu-principal ul li ul li:hover a:before{
    border-left-color: #fd994d;
        -webkit-transition: all 0.3s ease-in-out ;
    transition: all 0.3s ease-in-out 
}


.menu-principal ul li:hover ul{
    display: block;
}
/* fleche down */
.menu-principal  span:after
{
    width: 0;
    height: 0;
    border: 0.413em solid transparent; /* 5 */
    border-bottom: none;
    border-top-color: #fd994d;
    content: '';
    vertical-align: middle;
    display: inline-block;
    position: relative;
    right: -0.313em; /* 5 */
}



/*  =======*menu catégorie ***********/ 
 
  
.menu-principal-categorie ul{
    margin: 0 !important;
    padding:0 !important;
    list-style-type: none !important;
}
.menu-principal-categorie ul li{
    display: block;
}

.menu-principal-categorie a {
    display: block;
    line-height: 1.5em;
    border: 2px solid #fff ;
}
 .menu-principal-categorie a:hover  {
    border: 2px solid #fd994d;
} 
 



/* burger  */
/*---------------------------------------*/
.btn-menu {
    color: #fd994d;
    position: absolute;
    top: 5px;
    right: 20px;
 

}
.open{
    background-image: url('../img/open-burger.png');
        -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
        background-repeat: no-repeat;
         height: 40px;
    width: 40px;
}
.close{
    background-image: url('../img/close-burger.png');
        -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
     height: 40px;
    width: 40px;
    
}




/*------------ search ---------------------- */
/* search input field */
.recherche{
    position: absolute;
    top: 5px;
    right: 100px;
}
.recherche input[type=search] {

    background: #ededed url(../img/search-icon.png) no-repeat 9px center;
    background-color: #fff;
    border: solid 2px #fd994d;
    padding: 9px 5px 9px 32px;
    width: 35px;

    -webkit-border-radius: 10em;
    -moz-border-radius: 10em;
    border-radius: 10em;

    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    transition: all .5s;
}
.recherche input[type=search]:focus {
    width: 150px;
    background-color: #fff;
    border-color: #fd994d;

    -webkit-box-shadow: 0 0 5px rgba(254, 152, 15, 0.5);
    -moz-box-shadow: 0 0 5px rgba(254, 152, 15, 0.5);
    box-shadow: 0 0 5px rgba(254, 152, 15, 0.5);
}

/* placeholder */
.recherche input:-moz-placeholder {
    color: #999;
}
.recherche input::-webkit-input-placeholder {
    color: #999;
}

/*don*/
.don{
    position: absolute;
    top: 5px;
    right:140px;
}
 
/*------------------ bg ---------------*/
/* main */
/*---------------------------------------*/

/* Slider flexslider */
.slide{
    /* Full height */
    display: block;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /*padding: 14.5% 0;*/
    padding-top: 5%;
    padding-bottom: 5%;
    background-position: center;
}
.flexslider{
    border: none; 
}
.flex-direction-nav a:hover{
    color:#fd994d;
}
.flex-control-nav {
    bottom: 5px;
}
.flex-control-paging li a.flex-active {
    background: #fd994d;
    cursor: default;
}
.flex-control-paging li a {
    width: 45px;
    height: 10px;
    display: none;
}
.flex-direction-nav .flex-nav-prev:hover a:before,
.flex-direction-nav .flex-nav-next:hover a:before   {
    color: #fd994d;
}

.slide-text{
    padding: 10px;
    background: rgba(51, 51, 51, 0.4);
    -moz-box-shadow: 2px 2px 15px #999;
    -webkit-box-shadow: 2px 2px 15px #999;
    box-shadow: 2px 2px 15px #999;
}

 
/* background */
.bg-img-fix{
    background-image: url(../img/bg-eleves.webp);
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    background-attachment: fixed;
    z-index: -10 !important;
    padding: 4% 0;
    background-position: center;
}

.bg-fix{
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    background-attachment: fixed;
    z-index: -10 !important;
    padding: 4% 0;
    background-position: center;
}

.bg-ecole{
background: url(../img/bg-institution-nazareth.png) no-repeat top center;
background-color: #eae7cc;
}
.bg-header{
    background-color: #5992C8; 
    height: 70px;
}
 
/* === Pagination WP ==== */
.page-numbers {
    padding: 10px 15px !important;
    border: 1px solid #ddd !important;
}
 
.page-numbers:hover, .nav-links .current {
    background-color: #fd994d !important;
    color: #fff !important;
}
 
/*la Une*/ 

.une_item{
    border-radius: 5px;
}
.une_item a{
    position: relative;
    display: block;
    
}
.une_item a:before {
    background-image: linear-gradient(180deg,rgba(5,4,43,0),rgba(5,4,43,.84));
    bottom: 0;
    content: "";
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 1;
    border-radius: 5px;
}

.une_caption {
    position: absolute;
    z-index: 2;
    bottom: 30px;
    margin: 0 30px;
}

.title_une_item {
    display: inline;
    /*font-family: Pilat Condensed Heavy,Pilat Condensed-fallback,sans-serif;*/
    font-size: 1.75rem;
    letter-spacing: .05813rem;
    line-height: 1.75rem;
    margin-bottom: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: uppercase;
    color: #fff;
}


/*---------------------------------------*/
/* footer */
/*---------------------------------------*/
footer{
    color: #666;
    clear: both;
}

footer li a,footer li{
    color: #eee;
}
 
footer small {
    text-align: center;

}
footer small a
{
    color: #666;
    text-decoration: underline;

}
 
.icon-sociaux{
    margin: 0;
    padding: 0;
}
.icon-sociaux li{
    list-style-type: none;
}
.icon-sociaux li img{
    background-color: #fff;
    transition: all 0.3s;

}
.icon-sociaux li img:hover{
    background-color: #fd994d;
    transition: all 0.3s;

}
/*menu footer1*/

.footer-menu1{
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.footer-menu1 ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.footer-menu1 ul li{
    list-style-type: none;
    margin: 0;
    padding: 5px;
    
}
     .footer-menu1 ul li a:before {
    content: '\00003E';
    /*color: #fff;*/
    display: inline-block;
    font-family: icomoon;
    font-size: 20px;
    margin-right: 6px;
    vertical-align: middle;
 }
 .footer-menu1 ul li a:hover {
     color: #fd994d;
     font-size: 18px;
 }


    /* ------- Menu footer ---------- */
    .menu-footer ul{
        list-style-type: none;
        margin: 0;
        padding: 0;
        
    }
    .menu-footer ul li{
        display: inline-block;
        list-style-type: none;
    }

    .menu-footer ul>li>a{
        display:  block;
        color:#eee;
        border-right: 1px solid #bbb;
        padding: 0 5px;
        margin:0;
    }
    .menu-footer ul li:last-child a{
        border-right: 0px;
    }
    .menu-footer a:hover {
        color: #fd994d;
        border-bottom: 0;
        background-color:transparent;
    }
    .menu-footer .current_page_item  a {
        border-bottom: 0px  !important;
        color: #fd994d !important;
    }
/* ------- box-shadow---------- */
.box-shadow {
    -moz-box-shadow: 2px 2px 15px #999;
    -webkit-box-shadow: 2px 2px 15px #999;
    box-shadow: 2px 2px 15px #999;
}
.buton-partenaire{
    border: 2px solid #fff;
    border-radius: 10px; 
    transition: all 0.3s ease-in-out;
}
.buton-partenaire:hover{
    border: 2px solid #fd994d ;
    transition: all 0.3s ease-in-out;
}
   


/* ------- vignette-categorie ---------- */
    .vignette-caterogie {
        width: 170px;
        height:170px;
    position: relative;
}
 
.box-categorie{
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 7px solid #fff;
    border-radius: 100px;
    transition: all 0.3s ease-in-out;
}
.box-categorie:hover{
  border: 10px solid #fff;
    transition: all 0.3s;
}
 
.text {
  width: 100%;
  height: 100%;
  text-align: center;
   
  display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase
}


.vignette-caterogie .cat-titre {
    color: #fff;
}
.vignette-caterogie .cat-titre:hover {
    color: #0065AF;
}
.image-category img{
    width: 100%;
}

   .vignette-caterogie-2 {
    margin-top: -70px !important;  
}


.titre-infos {
    border-bottom: 1px solid #eee;
    padding: 15px 0;
    margin: 0;
    display: block;
    transition: all 0.3s ease-in-out ;

}
.titre-infos:hover{
    border-bottom: 1px solid #eee;
    transition: all 0.3s ease-in-out ;
    color: #1e97c8;

}
.titre-infos:hover small{
    color: #0099cc;
    transition: all 0.3s ease-in-out ;
}

 
.lien-title {
    margin: 0;
    display: block;
    transition: all 0.3s ease-in-out ;
    color: #222;
}
.lien-title:hover {
    color: #1e97c9;
    transition: all 0.3s ease-in-out ;
}


/* -----------Contenus---------*/
.image-height{
    max-height: 180px;
    display: block;
}

 
 
.bg-citation {
    background-image: url(../img/bg-bleu-clair.svg);
    background-size: 100% 110px;
    bottom: 0;
    height:64px;
    z-index: 1;
    transform: scale(1,1);
}
 

/*================================*/

/*--------------------------------------------------------*/
/*Responsive Web Design*/
/*--------------------------------------------------------*/
 

  
/* tablet view */
/*--------------------------------------------------*/
@media only screen and (min-width: 480px) {
.titre-height{
    min-height: 65px;
    padding-top: 10px;
}

 

}

/* desktop view */
/*-------------------------------------------------*/
@media only screen and  (min-width: 769px) {
    
    .excerpt p{
         line-height: 1.3em;
    }
       

    .logo-grand{
        position: absolute;
        top: 0px;
        left:5px;
        width: 110px;
        transition: all 0.3s;
    }
    .logo-scoll{
        width: 80px; 
        transition: all 0.3s;
    }
    /*don*/
    .don{
        position: relative;
        margin-top:5px;
        right: 40px;
    }

    .recherche{
        right: 20px;
    }

    /* ------- vignette ---------- */
    
   .vignette-caterogie {
    margin-top: -94px !important;  
}

    /* burger  */
    /*---------------------------------------*/
    .btn-menu {
        display: none;
    }
    .btn-menu-categorie {
        display: none;
    }

    /* menu */
    /*-----------------------------------*/
    .menu-principal {
        opacity: 1;
        height: auto;
    }
    .menu-principal li {
        display: inline-block;
        text-align: left;

    }

    .menu-principal li a {

        margin-left:1.25em;
        padding: 0.5em 0;
        /*font-size: 1.15em;*/
        color: #fff;
        background-color: transparent;
        border-bottom: 4px solid transparent;
        -webkit-transition: all 0.3s ease-in-out ;
        transition: all 0.3s ease-in-out ;
        font-weight: 700;

    }

    .menu-principal .current, .menu-principal a:hover {
        color: #fff;
        border-bottom: 4px solid #fff;
        background-color:transparent;
    }
 
    .current-menu-item > a{
        border-bottom: 4px solid #fd994d !important;
    }
    /* menu niveau 2*/
    .menu-principal ul li ul{
        display: none;
        position: absolute;
        height: auto;
        margin-left: 20px;
        border-bottom: 1px solid #eee;
    }
    .menu-principal ul li ul li{
        float: none !important;
        display: block;
        background-color: #80c8e6;
        color: #fff;
    }

    .menu-principal ul li ul li a{
        margin:0;
        padding: 10px;
        width: 250px;
        border-top: 1px solid #eee;
        font-weight: 400;
    }
    .menu-principal ul li ul li a:hover{
         background-color: #f7c997;
    }
 

.titre-height{
    min-height: 65px;
    padding-top: 10px;
}

 bg-citation {
    background-image: url(../img/bg-bleu-clair.svg);
    background-size: 100% 34px;
    height: 32px;
}

.bg-citation {
    background-size: 100% 110px;
    height:69px;
}
  
}

@media only screen and (min-width: 1024px) {
    .scoll{
        padding:10px !important;
        transition: all .3s;
    }
    
    .titre-height{
    min-height: 110px;
        padding-top: 10px;
        max-height: 120px;
        overflow: hidden;
}
.bg-citation {
    background-size: 100% 110px;
    height:77px;
}
 

}
@media only screen and (min-width: 1440px) {
    .scoll{
        padding:10px !important;
        transition: all .3s;
    }
    
    .titre-height{
    min-height: 110px;
        padding-top: 10px;
        max-height: 120px;
        overflow: hidden;
}

.bg-citation {
    background-size: 100% 110px;
    height:85px;
}

}