/* Your custom styles */
.avatar img{
  max-width: 150px;
  height: auto;
}

.main-wrapper {
  margin-left: 5%;
  margin-right: 5%;
}


section.dark-section {
  color: #fff;
}

}

:target:before {
  content:"";
  display:block;
  height:74px; /* fixed header height*/
  margin:-74px 0 0; /* negative fixed header height */
 }

/* For the intro section */
.top-nav-collapse {
    background-color: #fa826f ;
}
.navbar:not(.top-nav-collapse) {
    background: transparent ;
}
@media (max-width: 768px) {
    .navbar:not(.top-nav-collapse) {
        background: #fa826f ;
    }
}
h1-header {
    letter-spacing: 8px;
}
h5-header {
    letter-spacing: 3px;
}
.hr-light {
    border-top: 3px solid #fff;
    width: 80px;
}
@media (max-width: 740px) {
    .full-height,
    .full-height body,
    .full-height header,
    .full-height header .view {
        height: 700px;
    }
}


/* For the climate page */

.top-nav-collapse-green {
    background-color: #91f5ad ;
}
.navbar:not(.top-nav-collapse-green) {
    background: transparent ;
}
@media (max-width: 768px) {
    .navbar:not(.top-nav-collapse-green) {
        background: #91f5ad ;
    }
}

.presentations-programme {
text-align: center;
margin: 0px;
font-size: 2em;

/*justify-content: center;
*/
}
.presentation-programme h2{
font-weight: bold;
padding: 20px;
/*display: inline-block;*/

}



.presentation-programme-content {
     margin: auto;
    width: 70%;
    justify-content: center;
    align-items: center;
    font-size: 2em;
}

.icons {
  font-size: 1.5em;
}

.date-bold {
font-weight: bold;
}

.programme-unique {
justify-content: center;
background-color: rgba(145, 245, 173, 0.16);
padding-top: 20px;
padding-bottom: 20px;

}

.climate-lessons {
  color: white;
  font-weight: bold;
  font-size: 1.5em;
  padding-bottom:40px;
}

.deep-green {
  background-color: #91f5ad !important;
   }


.btn-deepd-green {
  background-color: #52de97;
       }
  .btn-deep-green:hover {
    background-color: #91f5ad !important; }
  .btn-deep-green:focus, .btn-deep-green:active, .btn-deep-green.active {
    background-color: #91f5ad !important; }
  .btn-deep-green.dropdown-toggle {
    background-color: #91f5ad !important; }
    .btn-deep-green.dropdown-toggle:hover, .btn-deep-green.dropdown-toggle:focus {
      background-color: #52de97 !important; }

.btn-white {
  background-color: #fff; }
  .btn-white:hover {
    background-color: white !important; }
  .btn-white:focus, .btn-white:active, .btn-white.active {
    background-color: #d9d9d9 !important; }
  .btn-white.dropdown-toggle {
    background-color: #fff !important; }
    .btn-white.dropdown-toggle:hover, .btn-white.dropdown-toggle:focus {
      background-color: white !important; }

.background-climate {
  background-image: cover;
}

.card-prog {
color: solid black;
font-size: 1.5em;
 padding: 10px;
  text-align: center;

}


.text-align {
  text-align:center;
}

.cards-front {
background-color: #91f5ad;
display: flex;
flex: 1;

}

.argument {
font-style: bold;
font-size: 3em;
background-color: #ffffff;
    margin: 40px;
border-radius: 8px;
  padding:15px;
  font-weight: bold;
  font-stretch: condensed;
  text-align:center;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.23px;
  text-align: center;
  color: #191919;
  flex: 1;
  padding-bottom: 15px;

}

.argument p {
  margin-top: 30px;
   /*margin-bottom: 30px;*/
   margin-bottom: 30px;
}



.tryptique-programmes {
  justify-content: center;
  display: flex;
}

.programme-unique h2{
font-weight: bold;
text-align: center;
padding-top: 20px;

}

.green-background-square {
background-color: rgba(145, 245, 173, 0.16);

}

.green-background-light {
background-color: rgba(145, 245, 173, 0.16);
margin: 0;
padding: 30px;

;

}

.small-em {
font-size: 1.5em;
}

.backgound-climate{
  object-fit:cover;
  width: 100%;

}


.deroule-du-programme {
  text-align: center;
margin:20px 0px;
}

@media (max-width: 800px) {

  .tryptique-programmes {
flex-direction: column;
width: 100%;
flex: 1;
    }
  }

  .presentation-programme h2 {
  font-size: 2em;
  }

  @media (max-width: 800px) {
  .cards-front {
flex-direction: column;
width: 100% !important;
flex: 1;
    }
  }

.padding-bottom {
  padding-bottom: 30px;
}