/* Règles pour les balises structurantes*/
html, body {
    height:100%;
    width: 100%;
    color: #222; /*presque noir*/
    background-color: white; /*jaune clair*/
        display: flex;
    flex-direction:column;
    min-height: 100vh;
}

p{
    margin-left:20% !important;
    margin-right:20% !important;
    text-align:justify;
}

.exp { text-align:justify !important;}

h1, h2, h3{
    color: #023246; /*rouge foncé*/
    text-align:center;
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
}

.center {
text-align: center !important ;
margin-bottom: 1rem;
margin-top: 1rem;
}

h2{
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
}

a, a:hover {
color: #33a196;
}

 ul, li {
 text-align: center;}

.calende {
text-align: left;}

.calendeul  {margin: auto;
  width: 50%;}

.main-container {
     min-height: 100vh; /* will cover the 100% of viewport */
     overflow: hidden;
     display: block;
     position: relative;
     padding-bottom: 300px; /* height of your footer */
}

/* Règles pour la barre de navigation */
.navbar {
    background-color: #023246 !important; /*jaune clair*/
}

.nav-link {
  color: #33a196 !important ; /*rouge foncé*/
  border-radius: 5px;
}

.nav-link:hover, .nav-link:focus {
    color: #f6f6f6 !important ; /*jaune clair*/
    background-color: #023246; /*rouge foncé*/
}

/* Règles pour le footer */
footer {
    color:#33a196;
    background-color: #023246;
    margin-top: auto;

}

.contenu {
padding-bottom: 3rem;
}

/* Règles pour les boutons de réseaux sociaux*/
.social, .social:hover {
    color:#ffffe6;
    font-size: 30px;
    padding: 1rem;
}


/* Règles pour les logos des archives */
.logoa {
    width:150px;
    height:auto;
}


.marge {
margin-left: 50px;
}