@import url(https://fonts.bunny.net/css?family=albert-sans:300|karla:300);
body {
  min-height: 100vh; /* toute la hauteur du viewport */
  padding: 0;
  margin: 0;
  font-family: 'Albert Sans', sans-serif;
}
/********** définition du background ************/
div#imagebg{
       margin: 0;
       padding: 0;
       width:100%;
       height:100%;
       background-attachment:fixed; 
       background-repeat:no-repeat;
       background-position: center center;
       background-size: cover; 
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
}  

#logo img { display:block; margin: 0 auto; max-width: 100%; }

h1 {
	margin: 0;
	padding: 0;
    height: 0; 
    text-indent: -999em;
}
h2 {
    margin: 0;
    letter-spacing: 0.2em;
    font-size: 1.5em; 
    text-align: left;
    padding: 5px;
    color: #fff;
    line-height: normal;
    font-family: 'Karla', sans-serif;
    text-shadow:1px 1px #000;
}
h3 {
    color: #fff;
    font-weight: 400;
    margin: 0;
    padding: 0 10px 0 10px;
    letter-spacing: 0.2em;
    line-height:30px; 
    font-size:20px; 
    text-shadow:1px 1px #000;
}
h3.item-title {
    background-color: rgba(255,255,255,0.4);
}
h3.homeh3 {
    text-shadow:1px 1px #000 !important;
}
h4 {
	color: #fff;
    letter-spacing: 0.1em;
    font-weight: 400;
	font-size: 1.1em;
	margin: 0px 0 0px 0;
	padding: 0px 0 0px 0;
    text-shadow:1px 1px #000;
}
.bloc h4 {
	color: #000000;
    text-shadow: none;
}
h5 {
	color: #fff;
	font-size: 1.1em;
	line-height: 1.3em;
	margin: 0 0 0.25em 0;
}
a, a:link, a:active, a:visited {
	text-decoration: none;
	color: #e47020;
}
a:focus {
	outline: thin none !important;
}
.card-materiel {
    background-color: rgba(255,255,255,0.8);
}
hr {
	border-top: 1px solid rgba(255,255,255,.75);
}
/******************************************************/
/* MENUBAR                                            */
/******************************************************/
#menubar {
  background-color: rgba(0,0,0,0.6);
  margin-bottom: 10px;
  font-size: 1.05em;
}
#menubar li.active a{
 color: #e47020;
}
#menubar a {
    word-wrap: normal;
}
#menubar a:hover {
 color: #ccc;
}
.navbar-dark .navbar-nav .nav-link {
    color: #fff;
}
.dropdown-menu {
	margin: .5rem 0 0;
	padding: .25rem .25rem;
	width: inherit;
	background-color: rgba(0,0,0,0.9);
	border: 0px solid rgba(0,0,0,.15);
	border-radius: 0;
	font-size: 0.9em;
}
.dropdown-menu a, .dropdown-menu a:link, .dropdown-menu a:active, .dropdown-menu a:visited {
    color: #fff;
}
@media screen and (max-width: 440px) { 
    .dropdown-item { white-space: pre-wrap; }
}
.dropdown-item:focus, .dropdown-item:hover {
    color: #fff;
    text-decoration: none;
    background-color: #e47020;
}
.dropdown-divider {
	border-top: 1px solid rgb(248, 249, 246);
}
.dropdown-item.active, .dropdown-item:active {
  background-color: #949494;
}
.page-item.active .page-link {
	background-color: #e47020;
	border-color: #e47020;
}
/******************************************************/
/* CONTENU                                            */
/******************************************************/
#content {
    background-color: rgba(0,0,0,0.3);
}
#content a:hover {
	text-decoration: none;
	color: #ffffff;
}
/******************************************************/
/* SIDEBAR                                            */
/******************************************************/
#sidebar
{ font-size:0.9em; }

#sidebar h3, .blockh3 {
    padding-left:10px;
    color: #fff;
    background-color: rgb(255,255,255,0.4);
    text-shadow:1px 1px #000;
}
#sidebar .separator {
    display: none;
}

/******************************************************/
/* HEADER PAGE D'ACCUEIL                              */
/******************************************************/
#header-container {
    position: relative;
}
#header-text {
    position: absolute;
    top:15px;
    width: 100%;
}
#slogan {
    color: #fff;
    font-size: 1.6em;
    letter-spacing: 0.2em;
    text-shadow:1px 1px #000;
    margin-bottom: 20px;
    padding-right: 20px;
}
/******************************************************/
/* BLOCS                                              */
/******************************************************/
.bloc, #galerie  {
   margin:0 0 20px 0;
   color: #000000;
   background-color: rgba(255,255,255,0.8);
}
.bloc  {
   padding: 20px;
}
.bloc h3 {
    color: #000000;
    text-shadow:none;
}
.bloc img {
   border: 0px solid #D9E2E6;
}
.bloc ul {
      padding: 5px 0 0 5px;
      list-style-position:inside;
}
.infos {
      width: auto;
      text-align: right;
      display: block;
      margin-top: 10px;
}
/******************************************************/
/* DIVERS                                             */
/******************************************************/
.libelle {
  font-weight: 700;
  color: #e47020;
}
.copy {
  padding-top: 10px;
}
.rs {
  font-style: italic;
}
.dicton {
  font-style: italic;
}
.fontsize2 {
	font-size: 0.9em;
}
.fc-title:hover {
    cursor: pointer;
}
.alignright {
  margin: 0 0 0 10px;
  display:block; 
  float:right;
  max-width: 100%;
}
.bloc .infos a, .btn-default {
    padding: 5px 15px;
    background-color: rgba(0,0,0,0.5);
    color: #fff;
}
.infos a:hover, .infos a:focus, .btn-default:hover
{
    background-color: #e47020;
    color: #fff !important;
}
/******************************************************/
/* SEJOURS CONFIRMES                                  */
/******************************************************/
.slick-bs {
    padding-left: 15px;
    padding-right: 15px;
    /* margin-bottom: 15px; */
}
.slick-item-container {
    padding: 0 5px;
}
.slick-item {
    width: 100%;
    position: relative;
}
.slick-text {
    position : absolute;
    bottom: 0;
    right: 0;
    padding: 0 5px;
    background-color: rgba(0,0,0,0.1);
    color: #ffffff;
    width: inherit;
    text-align: center;
}
.slick-date {
    position : absolute;
    top: 10px;
    right: 7px;
}
.next-date {
    display: block;
    padding: 0 5px;
    margin-bottom: 5px;
    background-color: #e47020;
    color: #ffffff;
}
.slick-projet {
    position : absolute;
    top: 40px;
    right: 7px;
    padding: 0 5px;
    text-transform: uppercase;
    background-color: #e47020;
    color: #ffffff;
}
.slick-title {
    font-size:1.2em;
}
.slick-prev::before, .slick-next::before {
	color: #202020;
}
/******************************************************/
/* FIL D'ARIANE --- BREADCRUMBS                       */
/******************************************************/
.breadcrumbs {
  color: #fff;
  padding: 5px 0 5px 5px;
  margin: 5px 0;
  font-size: 85%;
  margin: 0px;
}
/******************************************************/
/* CARTES PARCOURS                                    */
/******************************************************/
.legende {
   margin: 0 auto;
   text-align: center;
   font-style: italic;
   font-size: 0.8em;
}
/******************************************************/
/* FORMULAIRE                                         */
/******************************************************/
.submit {
   text-align: center;
}
.inscription-formulaire label {
   display:inline-block;
   min-width:200px;
}
.inscription-formulaire .typeduree > div label {
   display:inline;
   width:auto;
   min-width:120px;
}
.inscription-formulaire > div {
   margin-bottom: 5px;
}
/******************************************************/
/* ACTUALITES                                         */
/******************************************************/
#sidebar .carousel-indicators { 
    text-align: right; z-index: 500; position: absolute; top: 10px; overflow: hidden; right: 5px;
}
/* caption */
#sidebar .carousel-caption { 
    position: absolute; bottom: 0; left: 0 !important; right: 0 !important; width: 100%; z-index: 600;
    background-color: rgba(255,255,255,0.8); color: #000000; padding:0;
    text-shadow: none;
}
/* texte caption */
.textarticle { text-align:center; color: #000000; z-index: 700; text-shadow:none;  padding: 0 10px;}
.textarticle p { margin-bottom: 0; }
.titreactu {
  display: block;
  font-weight: 700;
font-size: 1.2em;
}
/******************************************************/
/* FOOTER                                             */
/******************************************************/
footer {
  color: #fff;
  background-color: rgba(0,0,0,0.6);
}
#footer .separator {
    display: none;
}
/* Return on top */
#returnOnTop {
    bottom: 1%;
    cursor: pointer;
    text-align: center;
    color: #fff;
    display: none;
    filter: alpha(opacity = 70); /* IE < 8 */
    height: 40px;
    opacity: 0.7;
    position: fixed;
    right: 1%;
    width: 40px;
    font-size: 24px;
    background-color: rgba(0,0,0,.8);
    border-radius: 20px;
}
#returnOnTop:hover {
    filter: alpha(opacity = 100); /* IE < 8 */
    opacity: 1;
}
/***************************************************************************/
/* pour les smartphones (width < 320px), affichage de l'image headerbg     */
@media screen and (max-width:320px) { 
  header { background-color: rgba(0,0,0,0.6);}
  textarea { width: 100% !important; }
}
/***************************************************************************/
/* pour les smartphones (width > 320px), affichage de l'image headerbg     */
@media screen and (min-width:321px) { 
  header { background-color: rgba(0,0,0,0.3);}
}
/***************************************************************************/
/* pour écrans (width > 768px), le n° de tel n'apparait pas                */
@media screen and (min-width: 769px) {
   #logo img { margin-top:40px;}
  .lienproduitauto {text-align: right;}
  .infos-accueil {display : inline-block;}
}
/**********************************************************************/
/* Pour les écrans de moins de 768px, on adapte le calendrier         */
@media screen and (max-width: 768px) { 
  footer { text-align: center; }
  #logo img { margin-top:15px;}
  .lienproduitauto {text-align: center;}
  .infos-accueil a {display : block; width:100%; text-align: center;}
}
/**********************************************************************/
/* Pour les écrans de moins de 768px, on adapte le calendrier         */
@media screen and (min-width: 441px) and (max-width: 768px) { 
  #blocactus {width: 360px; margin: 0 auto;}
  #photos {width: 360px; margin: 0 auto;}
  #galerie .col-12 {width: 50%;}
}
/***************************************************************************/
/* pour les smartphones (width <= 440px), le slide disparait               */
@media screen and (max-width: 440px) { 
 input, textarea, select { width: 100%; }
}
.grecaptcha-badge { visibility: hidden; }