@charset "UTF-8";
@font-face {
  font-family: "jrhandregular";
  src: url("/files/tabularasa/css/font-awesome/jrha-webfont.eot");
  src: url("/files/tabularasa/css/font-awesome/jrha-webfont.eot?#iefix") format("embedded-opentype"), url("/files/tabularasa/css/font-awesome/jrha-webfont.woff2") format("woff2"), url("/files/tabularasa/css/font-awesome/jrha-webfont.woff") format("woff"), url("/files/tabularasa/css/font-awesome/jrha-webfont.ttf") format("truetype"), url("/files/tabularasa/css/font-awesome/jrha-webfont.svg#jrhandregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* COULEURS GLOBALES */
/* BACKGROUNDS */
/* PROVISOIRE */
.bot20 {
  margin-bottom: 20px;
}

.bot25 {
  margin-bottom: 25px;
}

.bot50 {
  margin-bottom: 50px;
}

.bot100 {
  margin-bottom: 100px;
}

.bot150 {
  margin-bottom: 150px;
}

.bot200 {
  margin-bottom: 200px;
}

.top20 {
  margin-top: 20px;
}

.top25 {
  margin-top: 25px;
}

.top50 {
  margin-top: 50px;
}

.top100 {
  margin-top: 100px;
}

.top150 {
  margin-top: 150px;
}

.top200 {
  margin-top: 200px;
}

.padtop25 {
  padding-top: 25px;
}

.padtop50 {
  padding-top: 50px;
}

.padtop100 {
  padding-top: 100px;
}

.padbot25 {
  padding-bottom: 25px;
}

.padbot50 {
  padding-bottom: 50px;
}

.padbot100 {
  padding-bottom: 100px;
}

.invisible {
  display: none;
}

.fontsize20 {
  font-size: 20px !important;
}

/*PICTO - https://fonts.google.com/icons?icon.platform=web pour paramétrer l'apparence des pictos*/
.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-variation-settings: "FILL" 0, "wght" 700, "GRAD" 200, "opsz" 40;
}

/* Permet de mettre la bonne largeur de colonne en flex lorsque l'on utilise un gap.
* $colCount = Le nombre de colonnes que l'on veux
* $gap = le gap entre les colonnes, en px ou en %
* $grow = le flex grow, pas obligé a renseigné
* $shrink = le flex shrink, pas obligé a renseigné
**
* Exemple, pour un bloc avec 4 colonnes et un gap de 25px, on l'appel de cette manière : @include columnWithGap(4,25px);
*/
/*POLICE - intégration/chemin à mettre dans contao et non ici*/
/*GRAISSE (regular, bold, black...)*/
/*OMBRE*/
/*TRANSITION*/
/*DEGRADES*/
/*ARRONDI*/
/*Si besoin de changer des choses pour les très grands écrans, écrire ici :
@media (min-width:1930px) {
	.separateur{
		background-image: inherit; 
	}
}*/
@media (min-width: 1300px) {
  .milleCent,
  #header .inside,
  .mod_breadcrumb ul,
  #blocTop .milleCent,
  #footer .milleCent {
    width: 1300px;
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
  .contenu .milleCent {
    width: 1100px;
  }
  #slid {
    width: 100%;
  }
  .clic {
    display: none;
  }
}
@media (max-width: 1350px) {
  .milleCent,
  #header .inside {
    width: 1100px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (max-width: 1150px) {
  .milleCent,
  #header .inside {
    width: 95%;
  }
  .clic, .telephone, #contact_lateral {
    display: none;
  }
  /*#container{
  	width: 95%;
  	margin: 0 auto;
  }*/
  .contenu {
    /*AGENDA*/
    /*PORTFOLIO*/
  }
  .contenu .mod_eventlist {
    align-items: flex-start;
  }
  .contenu .ce_ctePortfolio .listFolio a {
    flex: 0 1 49.5%;
  }
}
@media (max-width: 940px) {
  #header .inside {
    justify-content: space-between !important;
  }
  #header .mod_navigation {
    display: none;
  }
  #tel, #contact_lateral {
    display: none;
  }
  /*ANIMATIONS*/
  .wow {
    animation-name: inherit !important;
    visibility: inherit !important;
    animation-delay: inherit !important;
  }
  /*PAGE ACTUALITES*/
  #toutes_actus .layout_latest_liste {
    flex: 0 1 48%;
  }
  #article-176 .mod_eventlist .layout_teaser, .page_108 .mod_eventlist .layout_teaser {
    flex: 0 1 32%;
  }
  .separateur {
    background-image: inherit;
  }
  /*PHOTOTHEQUE*/
  .ce_gallery ul.cols_6 li, .ce_gallery ul.cols_5 li {
    flex: 0 0 calc(100% / 3 - 2% / 3 * (3 - 1));
  }
  .contenu {
    /*PORTFOLIO*/
  }
  .contenu .ce_ctePortfolio .listFolio img {
    height: 250px;
  }
  .contenu .ce_ctePortfolio .listFolio .lienFolio {
    flex: 0 1 32%;
  }
  .contenu .ce_ctePortfolio #detailsFolio .galerie .photos img {
    flex: 0 1 31%;
  }
}
@media (max-width: 767px) {
  #blocTop #raccourci-header .col_1, #blocTop #raccourci-header .col_2 {
    margin-bottom: 0px;
  }
  #header {
    position: inherit;
  }
  #header .mod_navigation {
    display: none;
  }
  #slide, #slide > .inside {
    height: 300px;
  }
  #slide > .inside {
    position: relative;
  }
  #slide:after {
    display: none;
  }
  #slide .mod_rocksolid_slider {
    display: none;
  }
  #slide h1 {
    font-size: 18px;
    line-height: 22px;
    margin-left: auto;
    margin-right: auto;
  }
  /*#container{
  	flex-wrap: wrap-reverse; //si besoin d'inverser l'ordre des colonnes
  	#main{
  		flex: 0 1 100%;
  	}

  	#left{
  		flex: 0 1 100%;
  	}
  }*/
  .col_1, .col_2, .col_3, .col_4, .col_5 {
    float: left;
    width: 100% !important;
    clear: both;
    margin-bottom: 40px;
  }
  .col_1 .ym-gbox-left, .col_1 .ym-gbox-right, .col_1 .ym-gbox, .col_2 .ym-gbox-left, .col_2 .ym-gbox-right, .col_2 .ym-gbox, .col_3 .ym-gbox-left, .col_3 .ym-gbox-right, .col_3 .ym-gbox, .col_4 .ym-gbox-left, .col_4 .ym-gbox-right, .col_4 .ym-gbox, .col_5 .ym-gbox-left, .col_5 .ym-gbox-right, .col_5 .ym-gbox {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .top100 {
    margin-top: 50px;
  }
  .bot100 {
    margin-bottom: 50px;
  }
  #vignettes {
    margin-top: 50px;
  }
  .contenu #slide {
    height: 150px;
  }
  #footer section {
    flex-wrap: wrap;
  }
  #footer .col_1 .ce_image, #footer .col_1 .ce_text {
    text-align: center;
  }
  #footer .col_1 .ce_image img, #footer .col_1 .ce_text img {
    margin: 0 0 10px 0;
  }
  #footer .col_1 .ym-gbox-left {
    display: block;
  }
  #footer .col_1, #footer .col_2, #footer .col_3, #footer .col_4, #footer .col_5 {
    flex: 0 1 100%;
  }
  #footer .mentions, #footer .tabularasa {
    text-align: center;
  }
  #footer > .inside > section > div:last-child {
    margin-bottom: 0px;
  }
  /*PHOTOTHEQUE*/
  .ce_gallery ul.cols_6 li, .ce_gallery ul.cols_5 li, .ce_gallery ul.cols_4 li {
    flex: 0 0 calc(100% / 2 - 2% / 2 * (2 - 1));
  }
  .centrer_inversion_contenu,
  .aligner_inversion_contenu {
    display: flex;
    flex-wrap: wrap-reverse !important;
  }
  .centrer_inversion_contenu .col_1, .centrer_inversion_contenu .col_2,
  .aligner_inversion_contenu .col_1,
  .aligner_inversion_contenu .col_2 {
    flex: 0 1 100%;
  }
  .centrer_inversion_contenu .col_1,
  .aligner_inversion_contenu .col_1 {
    margin-bottom: 0;
  }
  .centrer_inversion_contenu .col_2,
  .aligner_inversion_contenu .col_2 {
    margin-bottom: 50px !important;
  }
  .centrer_contenu {
    flex-wrap: wrap;
  }
  .centrer_contenu .col_1, .centrer_contenu .col_2, .centrer_contenu .col_3, .centrer_contenu .col_4, .centrer_contenu .col_5 {
    flex: 0 1 100%;
  }
  /*PAGE ACTUALITES*/
  #toutes_actus .layout_latest_liste {
    flex: 0 1 100%;
  }
  #actualites_liste section {
    display: block;
  }
  #actualites_liste section .col_2 .mod_newslist .uneActu a {
    min-height: auto;
    padding: 10px;
  }
  #actualites_cover .mod_newslist {
    display: block;
  }
  #actualites_cover .mod_newslist .uneActu {
    width: 80%;
    margin: 0 auto 20px auto;
  }
  #actualites_cover .mod_newslist .uneActu:last-child {
    margin-bottom: 0;
  }
  /*PAGE AGENDA*/
  .contenu .mod_eventlist {
    gap: 4%;
  }
  .contenu .mod_eventlist .evenement-liste {
    flex: 0 1 48%;
  }
  #article-176 .mod_eventlist .layout_teaser, .page_108 .mod_eventlist .layout_teaser {
    flex: 0 1 48%;
  }
  .contenu {
    /*PORTFOLIO*/
  }
  .contenu .ce_ctePortfolio .listFolio .lienFolio {
    flex: 0 1 49%;
  }
  .contenu .ce_ctePortfolio #detailsFolio .partieTop .contenu,
  .contenu .ce_ctePortfolio #detailsFolio .partieTop .infos {
    flex: 0 1 100%;
  }
  .contenu .ce_ctePortfolio #detailsFolio .partieTop .infos {
    margin-top: 30px;
  }
  .contenu .ce_ctePortfolio #detailsFolio .galerie .photos img {
    flex: 0 1 47%;
  }
  .historique::after {
    display: none;
  }
  .historique div {
    width: 100%;
    float: inherit;
    margin-bottom: 65px;
  }
}
@media (max-width: 550px) {
  #blocTop #raccourci-header .col_1 {
    display: none;
  }
  #blocTop #raccourci-header .col_2 {
    width: 100%;
  }
  #blocTop #raccourci-header .col_2 .reseaux_sociaux {
    justify-content: center;
  }
  /*PHOTOTHEQUE*/
  .ce_gallery ul.cols_6 li, .ce_gallery ul.cols_5 li, .ce_gallery ul.cols_4 li {
    flex: 0 0 calc(100% / 1 - 2% / 1 * (1 - 1));
  }
  #actualites_cover .mod_newslist .uneActu {
    width: 100%;
  }
  #article-176 .mod_eventlist .layout_teaser, .page_108 .mod_eventlist .layout_teaser {
    flex: 0 1 100%;
  }
  /*PAGE AGENDA*/
  .contenu .mod_eventlist .evenement-liste {
    flex: 0 1 100%;
  }
  .contenu .ce_ctePortfolio .listFolio {
    justify-content: center;
    flex: 0 1 100%;
    height: 250px;
    margin-right: 0;
    margin-top: 20px;
  }
  .contenu .ce_ctePortfolio .listFolio a {
    flex: 0 1 95%;
  }
  .contenu .ce_ctePortfolio .listFolio a .title, .contenu .ce_ctePortfolio .listFolio a:after {
    opacity: 1;
  }
  .contenu .ce_ctePortfolio #detailsFolio .galerie .photos {
    justify-content: center;
  }
  .contenu .ce_ctePortfolio #detailsFolio .galerie .photos img {
    flex: 0 1 100%;
  }
  .historique div h2 {
    padding: 20px;
  }
  .historique div .image_container {
    display: none;
  }
  #footer .col_1 .ym-gbox-left {
    display: block;
    text-align: center;
  }
  #footer .col_1 .ym-gbox-left figure {
    display: inline-block;
  }
}