@charset "UTF-8"; /* Définit l'encodage de caractères du fichier CSS */

/* Style pour une ligne horizontale bleue */
.blue-hr {
    border: none; /* Supprime les bordures par défaut */
    height: 40px; /* Définit la hauteur de la ligne */
    background-color: #004562; /* Définit la couleur de fond de la ligne */
    margin: 0; /* Supprime l'espace au-dessus et en dessous de la ligne */
}

/* Styles pour les paragraphes */
p {
    margin: 0; /* Supprime la marge par défaut des paragraphes */
}

/* Style pour les cartes de projet */
.project-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease; /* Ajoute une transition douce pour la transformation et l'ombre */
}

.project-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

/* Style pour le contenu des modales */
.modal-content {
    border-radius: 10px; /* Arrondit les coins du contenu de la modal */
}

/* Style pour le conteneur de particles.js */
#particles-js {
    position: absolute; /* Positionne le conteneur de manière absolue */
    top: 0; /* Positionne le conteneur en haut */
    left: 0; /* Positionne le conteneur à gauche */
    width: 100%; /* Prend toute la largeur de l'élément parent */
    height: 100%; /* Prend toute la hauteur de l'élément parent */
    z-index: -1; /* Assure que le conteneur est derrière d'autres éléments */
}

/* Styles pour les écrans de taille moyenne ou inférieure */
@media (max-width: 991.98px) {
    .nav-rounded {
        border-radius: 0 !important; /* Retire l'arrondi des bords pour les éléments de navigation */
    }
}

/* Style pour les éléments de compétences */
.skill-item {
    transition: transform 0.3s, box-shadow 0.3s; /* Ajoute une transition douce pour la transformation et l'ombre */
    padding: 20px; /* Ajoute de l'espace intérieur */
    border-radius: 10px; /* Arrondit les coins de l'élément de compétence */
    background: #fff; /* Définit la couleur de fond en blanc */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* Ajoute une ombre légère */
}

/* Effet de survol pour les éléments de compétences */
.skill-item:hover {
    transform: translateY(-5px); /* Lève l'élément de compétence de 5 pixels lors du survol */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); /* Renforce l'ombre lors du survol */
}

/* Style pour les icônes de compétences */
.skill-icon {
    transition: transform 0.3s; /* Ajoute une transition douce pour la transformation */
}

/* Effet de survol pour les icônes de compétences */
.skill-icon:hover {
    transform: scale(1.2); /* Agrandit l'icône de 20% lors du survol */
}

/* Styles pour les écrans de petite taille (450px ou moins) */
@media (max-width: 450px) {
    .navbar-brand {
        max-width: 200px; /* Ajuste la largeur maximale de la marque de la navbar */
    }

    .navbar-brand img {
        max-width: 100%; /* Assure que l'image occupe tout l'espace du lien réduit */
        height: auto; /* Maintient le ratio d'aspect de l'image */
    }
}

body {
    overflow-x: hidden;
}

* {
    margin:0;
    padding: 0;
}