/* CSS du carousel */
.carousel-item 
{
  height: 65vh;
  min-height: 350px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.carousel-control-prev,.carousel-control-next
{
	width: 50px;
	height: 50px;
	background-color: #01579B;
	border-radius: 50%;
	top: calc(50% - 25px);
	opacity: .8;
}

.carousel-control-prev
{
	left: 5%;
}
.carousel-control-next
{
	right: 5%;
}

/* CSS de la navbar */
#navbar1 
{
	background-color: #01579B !important;
}

#link1:hover,#link2:hover,#link3:hover,#link4:hover,#link5:hover
{
	background-color: #212121 !important;
}

#navbar2 
{
	background-color: #212121 !important;
}

/* CSS du corps */
#card1
{
	background-color: #01579B !important;
}

#card2
{
	background-color: #01579B !important;
}

#link6:hover, #link7:hover, #link8:hover
{
	background-color: #212121 !important;
	color: #fff;
}

#card3
{
	background-color: #01579B !important;
}

#link9:hover, #link10:hover, #link11:hover
{
	background-color: #212121 !important;
	color: #fff;
}

#card4
{
	background-color: #01579B !important;
}

.article
{
	transition: all 0.3s;
}

.article:hover
{
	transform: scale(1.05);
	color: #fff;
	background-color: #212121 !important;

}

/* CSS du footer */

#footer 
{
	background-color: #212121 !important;
}


   .card-img-overlay {
            background: rgba(0, 0, 0, 0.5); /* Couleur de superposition noire avec transparence */
            display: flex;
            justify-content: center;
            align-items: center;
            color: white;
            transition: background 0.3s ease;
        }

    .cardcat {
            margin-bottom: 1.5rem; /* Espacement vertical entre les cartes */
            position: relative;
            overflow: hidden; /* Assure que l'effet de superposition ne dépasse pas les limites de la carte */
            transition: transform 0.3s ease; /* Transition pour l'effet de zoom */
        }    


        .cardcat:hover .card-img-overlay {
            background: rgba(0, 0, 0, 0.7); /* Couleur de superposition assombrie au survol */
        }

        .cardcat:hover {
            transform: scale(1.05); /* Zoom léger au survol */
        }

        /* Page à propos */

         .profile-section {
            text-align: center;
            margin-bottom: 4rem;
        }

        .profile-img {
            border-radius: 50%;
            width: 200px;
            height: 200px;
            object-fit: cover;
            border: 5px solid white; /* Bordure pour faire ressortir la photo */
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); /* Ombre portée pour effet 3D */
        }

        .profile-background {
            position: relative;
            display: inline-block;
        }

        .profile-background::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url('https://via.placeholder.com/300x300'); /* Image de fond pour la photo */
            background-size: cover;
            background-position: center;
            border-radius: 50%;
            border: 5px solid rgba(0, 0, 0, 0.3); /* Bordure pour l'image de fond */
            z-index: -1;
        }

        .section-heading {
            margin-bottom: 2rem;
            text-align: center;
            font-weight: 700;
            color: #333;
        }


    /* Page de contact */
     .bodycontact {
	background-color: #fff;
	}
	.contact{
		padding: 4%;
		height: 400px;
	}
	.contact1{
		background: #01579B;
		color: #fff;
		padding: 4%;
		border-top: black solid;
		border-bottom: black solid;
		border-left: black solid ;
		border-top-left-radius: 0.5rem;
		border-bottom-left-radius: 0.5rem;
	}
	.contact-info{
		margin-top:10%;
	}
	.contact-info img{
		margin-bottom: 15%;
	}
	.contact-info h2{
		margin-bottom: 10%;
	}
	.contact2{
		background: #fff;
		padding: 3%;
		border-top: black solid;
		border-bottom: black solid;
		border-right: black solid ;
		border-top-right-radius: 0.5rem;
		border-bottom-right-radius: 0.5rem;
	}
	.contact-form label{
		font-weight:600;
	}
	
	.contact-form button:focus{
		box-shadow:none;
	}


	.login {
  min-height: 100vh;
}

.bg-image {
  background-image: url('../img/login.jpg');
  background-size: cover;
  background-position: center;
}

.login-heading {
  font-weight: 300;
}

.btn-login {
  font-size: 0.9rem;
  letter-spacing: 0.05rem;
  padding: 0.75rem 1rem;
}

/* Surcharge le fond de la pagination active */
.pagination .page-item.active .page-link {
    background-color: #ffc107 !important;  /* Jaune 'warning' */
    color: #fff !important;  /* Texte noir pour plus de lisibilité */
}

/* Si vous souhaitez également appliquer un style aux éléments non actifs (facultatif) */
.pagination .page-item.active {
    background-color: #ffc107 !important;  /* Fond jaune pour l'élément li */
    border-color: #ffc107 !important;  /* Bordure jaune */
}