/********************************
 Parametres generaux : 
********************************/
@font-face {
    font-family: 'DK Lemon Yellow Sun';
    src: url('../fonts/DKLemonYellowSun.eot');
    src: url('../fonts/DKLemonYellowSun.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DKLemonYellowSun.woff2') format('woff2'),
        url('../fonts/DKLemonYellowSun.woff') format('woff'),
        url('../fonts/DKLemonYellowSun.ttf') format('truetype'),
        url('../fonts/DKLemonYellowSun.svg#DKLemonYellowSun') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
  font-family: 'TSTAR-Regular';
  src: url('../fonts/TSTAR-Regular.eot?#iefix') format('embedded-opentype'),  url('../fonts/TSTAR-Regular.otf')  format('opentype'),
	     url('../fonts/TSTAR-Regular.woff') format('woff'), url('../fonts/TSTAR-Regular.ttf')  format('truetype'), url('../fonts/TSTAR-Regular.svg#TSTAR-Regular') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'TSTAR-Heavy';
  src: url('../fonts/TSTAR-Heavy.eot?#iefix') format('embedded-opentype'),  url('../fonts/TSTAR-Heavy.otf')  format('opentype'),
	     url('../fonts/TSTAR-Heavy.woff') format('woff'), url('../fonts/TSTAR-Heavy.ttf')  format('truetype'), url('../fonts/TSTAR-Heavy.svg#TSTAR-Heavy') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
    font-family: 'EB Garamond';
    src: url('EBGaramond-Regular.woff2') format('woff2'),
        url('EBGaramond-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
.no-mobile { display:block; } 
.mobile { display:none; } 

body { font-family: 'EB Garamond' !important; font-weight:normal; color:#000; font-size:16px; }
h1 { font-family: 'EB Garamond' !important; font-size:60px; font-weight:800; margin-bottom:25px; text-transform:uppercase; }
h2 { font-family: 'EB Garamond' !important; font-size:30px; font-weight:600; text-transform:uppercase; padding-bottom:0.3rem; }
h3 { font-family: 'EB Garamond' !important; font-size:20px; font-weight:600; padding-bottom:0.1rem; text-transform:uppercase; }
h3 strong { font-family: 'EB Garamond' !important; }
h4, h5 { font-family: arial; font-size:20px; font-weight:normal; padding-bottom:0.3rem; line-height:100%; }
h4, h5 { display: table; white-space:nowrap;  text-align: right; padding-right:20px; }
h4:after { content: ""; display: table-cell; width: 100%; background: url('/images/ligne-h4.gif') repeat-x left top 0%; }
h5:before { content: ""; display:table-cell ; width: 100%; background: url('/images/ligne-h4.gif') repeat-x right top 0%; }
h6 { font-family: 'EB Garamond' !important; font-weight:normal; color:#000; font-size:13px; }
main h4, main h5 { font-family: 'EB Garamond' !important; font-size:100px; font-weight:normal; text-transform:uppercase; padding-bottom:0.3rem; line-height:40px; }
main h4 { display: table; white-space:nowrap;  text-align: left; padding-right:20px; margin-top:40px; }
main h4:after { content: ""; display: table-cell; width: 100%; background: url('/images/ligne-h4.gif') repeat-x left top 0%; }
main h5 { display: table; white-space:nowrap;  text-align: right; padding-right:20px; margin-top:40px; }
main h5:before { content: ""; display:table-cell ; width: 100%; background: url('/images/ligne-h4.gif') repeat-x right top 0%; }
hr { border:1px solid #e5e5f0; height:0px; }
p { line-height: 24px; }
img { max-width:100%; }
img { height:auto!important; vertical-align:top; }
img.guillemet { max-width:initial; }
select, option { font-family: 'EB Garamond' !important; font-weight:normal; text-transform:uppercase; color:#000; font-size:16px; }


/********************************
 Liens, boutons et survol
 - couleurs
 - effets au survol
********************************/
b, strong { font-weight:bold; }
a, a.button, a.btn, a.incrust { -webkit-transition: all .2s ease-in; -moz-transition: all .2s ease-in; -o-transition: all .2s ease-in; transition: all .2s ease-in; }
.bouton, .btn-primary, .incrust { font-family:'DK Lemon Yellow Sun'; text-transform:uppercase; background-color:#b8111d; border: none; border-radius:25px; padding:10px 17px 9px 17px; color:#fff; display:inline-block; }
main .bouton:hover, main .incrust:hover { background-color:#000; text-decoration: none; color:#fff; transform: rotate(-5deg);  }
main a { color:#000; border-bottom:1px solid #000;}
main a:hover { color:#b8111d; text-decoration:none; }
main a img { mix-blend-mode: luminosity; }
main a img { mix-blend-mode: normal; }
main a:hover img { mix-blend-mode: initial; -webkit-transition: all .5s ease-out; -moz-transition: all .5s ease-out; -o-transition: all .5s ease-out; transition: all .5s ease-out; }
main a.jaune {  background-color:#b8111d; display:inline-block; }

.dropdown:hover .dropdown-menu { display:block; }
.dropdown-item:hover, .dropdown-item:focus, .dropdown-item.active { background-color:#b8111d; }
.back-to-top { cursor: pointer; position: fixed; bottom: 50px; right: 20px; display: none; }
.back-to-top:hover { background-color:#b8111d; }
.lb-outerContainer { height:100%!important; }

/********************************
 Carousel, 
 - calage haut pour le menu fixe
 - réglages pour les images 100%
 - réglages pour les légendes
********************************/
.carousel { margin-bottom: 0; }
.calage-menu-haut-fixe { padding-top: 0rem; }
.carousel-caption { bottom: 3rem; z-index: 10; background-color: rgba(178, 151, 80, 0.5);}
.carousel-item { height: 25rem; }
.carousel-item > img { position: absolute; top: 0; left: 0; min-width: 100%; height:auto!important; }

/*******************************
 Gestion des images
*******************************/
.container p img, td img { width:100%; height:auto!important; }
.bloc-galerie a { border:none; }
.bloc-galerie img { width:33%; margin:0; padding:25px; height:auto!important; filter: brightness(1); mix-blend-mode: initial; }
.bloc-galerie img:hover { filter: brightness(1.25); }
main .bloc-galerie .incrust { position:relative; top:-130px;  }

/*******************************
 agenda
*******************************/
.bloc-agenda { display:flex; flex-direction: row; flex-wrap: wrap; }
.bloc-agenda a { max-width:30%; box-shadow: 3px 3px 5px #aaa, -0.02rem -0.02rem 1px #aaa; margin:20px 20px 0 0; padding:20px; filter: brightness(1); border-radius:8px; }
.bloc-agenda a { max-width:30%; box-shadow: none; margin:20px 20px 0 0; padding:20px; filter: brightness(1); background-color:#e4eef2; }
.bloc-agenda a:hover { box-shadow: 3px 3px 5px #333, -0.02rem -0.02rem 1px #333; filter: brightness(1.25); text-decoration:none; }
.bloc-agenda a:hover { box-shadow: none; filter: brightness(1.08); text-decoration:none; padding-top:10px; }
.genre-actu { background-color:#333; color:#fff; font-size:1rem; width:100px; padding:0 5px 2px 5px; text-transform:uppercase;  }
.tags-agenda { color:#333; font-size:0.7rem;  }
.date-annulee { background-color:#ff0000; color:#fff; font-size:1rem; padding:0 5px 2px 5px; margin-left:10px; }
.bloc-mois { width:100%; background-color:#FFD700; text-transform:uppercase; font-family: 'EB Garamond' !important; padding-left:10px; padding:3px 10px 3px 10px; }

main table.listeDates { }
main table.listeDates tbody { width:100%; display:block; }
main table.listeDates tbody tr { width:100%; display:inline-block; }
main table.listeDates tr td { width:15%; padding:5px 10px 5px 25px; font-weight:bold; }
main table.listeDates tr td+td { width:25%; padding:5px 10px 5px 10px; font-weight:bold; text-transform:uppercase; }
main table.listeDates tr td+td+td { width:35%; padding:5px 10px 5px 10px; font-weight:normal; text-transform:initial;}
main table.listeDates tr td+td+td+td { width:25%; padding:5px 10px 5px 10px; font-weight:bold; text-transform:uppercase; }
main h2.centre { display:block; text-align:center; }
.mention { text-transform:initial; }

/*******************************
 gestion des blocs
*******************************/
nav.menuGauche { position : fixed; top:0; left:0; width:280px; height:100%; background-color:#53646e ; margin-left:0px; margin-top:0px; padding:30px; padding-top:0px; }
.navbar-expand-lg .navbar-nav { flex-direction:column; }
.container-fluid { padding-left:320px; padding-right:50px; padding-top:55px; }
iframe { max-width:100%!important; }

table { width:100%!important; display:block; border-spacing : 0; border:1px solid #ccc; margin-top:10px; }
main table { border:none; margin-top:0; }
table td { padding-left:15px; padding-right:15px; border:1px solid #ccc; vertical-align:top;}
main table td { float:left; border:none; }
main table td:first-child { padding-left:15px; margin-left:-15px; }
main table td:last-child { padding-right:15px; }

.pied-de-page { background-color:#000; margin-left:305px; padding:25px 60px 25px 60px; color:#fff; margin-left:-60px; margin-right:-60px; }
.pied-de-page b { text-transform:uppercase; }
.pied-de-page a { color:#fff; border-bottom:1px solid #fff; font-weight:bold; }
.pied-de-page table, .pied-de-page table td { border:0px; color:#fff; }

/*******************************
 modale
****************************/
.overlay { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100vw; height: 100vh; overflow: hidden; background-color: rgba(0,0,0,0.4); }
.modale { background-color: #fefefe; margin: 15% auto; padding: 20px; border: 1px solid #888; width: 80%; max-width: 750px; text-align: center; position: relative }
.close { color: black; float: right; font-size: 20px; font-weight: bold; opacity: .5; position: absolute; right: 20px }
.close:hover { color: black; text-decoration: none; cursor: pointer; }

/*******************************
 gestion du menu
*******************************/
ul.navbar-nav { font-family: 'EB Garamond' !important; font-size:20px; font-weight:500; text-transform:uppercase; }
.navbar-light .navbar-nav .nav-link { color:#fff; padding-top:15px; padding-bottom:5px; border-bottom:none; line-height:100%; }
.navbar-light .navbar-nav .nav-link:hover { transform: rotate(-1deg); color:#fff; border-bottom:1px solid ; font-weight:500; }
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link { color:#fff; border-bottom:1px solid; }
.navbar-brand { padding-bottom:20px; margin-right:0; }

/********************************
RESPONSIVE CSS - MEDIA QUERIES
********************************/


@media (max-width: 1200px) {
}

@media (max-width: 992px) {
	.carousel-item { height: 15rem; }
	.bloc-agenda a { max-width: 100%; margin:20px 0 0 0;}
	h1 { font-size:50px; }
}

@media (max-width: 768px) {
	.calage-menu-haut-fixe { padding-top: 100px; }
	.container-fluid { padding:57px 15px 20px 15px; }
	.navbar-collapse { padding-left:0px; padding-top:0px; padding-right:50px; }
	.navbar-brand { padding-bottom:0px; margin-right:0; width:70%; margin-left:10px; }
	main table, .pied-de-page table { margin:0; border:0; }
	main table td, .pied-de-page table td { width:100%!important; display:block; padding:0; border:0; }
	main table td:first-child, .pied-de-page table td:first-child { padding-left:0px; margin-left:0px; }
	main table td:last-child, .pied-de-page table td:last-child { padding-right:0px; }
	.back-to-top { display:none!important; }
	nav.menuGauche { position : fixed; top:0; left:0; width:100%; margin-left:0px; margin-top:0px; padding:30px; height:unset; display:inline-block; }
	h2 { display: block; white-space:normal;  text-align: left; padding-right:0px; }
	.bloc-galerie a { border:none; }
	.bloc-galerie img { width:100%; margin:0; padding:25px; height:auto!important; filter: brightness(1); }
	.bloc-galerie img:hover { filter: brightness(1.25); }	
	iframe { width:100%!important; height:auto!important;  }
	.no-mobile { display:none; } 
	.mobile { display:inline-block; } 
}

@media (max-width: 480px) {
	.carousel-item { height: 8rem; }
}
