/* CSS Document */

/* Font Face */
@font-face {
    font-family: "Montserrat";
    src: url("fonts/Montserrat.ttf") format("truetype");
}

/* Font Styling */
.FontsMontserrat {
    font-family: "Montserrat", sans-serif;
    font-weight: 700; /* Texte en gras */
}

.FontArial {
    font-family: "Arial", sans-serif;
}

/* Body Styles */
body {
    background-color: #111214; /* Fond sombre pour le corps */
    color: #333; /* Texte de couleur sombre pour le contraste */
}

/* Sections Padding */
.div1 {
    padding: 2% 2%;
    height: auto;
}

.div2 {
    padding: 5% 5%;
    height: auto;
}

.div3 {
    padding: 0;
    height: auto;
}

/* Background Colors */
.bg-gry {
    background-color: #f7f7f7; /* Gris clair pour les sections */
}

.bg-wht {
    background-color: #fff; /* Blanc pour les sections */
}

.bg-rd {
    background-color: #bc1a27; /* Rouge vif pour les sections importantes */
}

/* Branding */
.brand {
    max-width: 120px;
    height: auto;
}

.sp {
    max-width: 70px;
    height: auto;
}

.menu {
    max-width: 30px;
    height: auto;
}

/* Responsive adjustments */
@media screen and (max-width: 600px) {
    .brand {
        max-width: 100px;
    }

    .sp {
        max-width: 50px;
    }

    .menu {
        max-width: 20px;
    }
}

/* Links Styling */
.link1 {
    color: #111214; /* Couleur sombre pour les liens */
    text-decoration: none;
}

.link1:focus,
.link1:hover {
    color: #bc1a27; /* Changement de couleur au survol */
    text-decoration: none;
}

.link2 {
    color: #fff; /* Liens en blanc */
    text-decoration: none;
}

.link2:focus,
.link2:hover {
    color: #bc1a27; /* Changement de couleur au survol */
    text-decoration: none;
}

/* Button Styles */
.btn-white {
    background-color: #fff;
    color: #bc1a27; /* Couleur texte rouge vif */
    text-decoration: none;
    padding: 12px 24px; /* Taille augmentée pour les boutons */
    border-radius: 8px; /* Coins arrondis */
    border: 1px solid #bc1a27; /* Bordure rouge */
}

.btn-white:focus,
.btn-white:hover {
    background-color: #bc1a27; /* Changement de fond au survol */
    color: #fff; /* Texte en blanc au survol */
    text-decoration: none;
}

/* Text Color */
.textred {
    color: #bc1a27; /* Texte en rouge vif */
}

.textwhite {
    color: #fff; /* Texte en blanc */
}

.textblack {
    color: #000; /* Texte en noir */
}

/* Additional Styling for text and headings */
h1, h2, h3, h4, h5, h6 {
    font-family: "Montserrat", sans-serif;
}

h1, h2, h3 {
    font-weight: 700; /* Poids de police plus élevé pour les titres */
}

h4, h5, h6 {
    font-weight: 400; /* Poids de police plus léger pour les sous-titres */
}

/* Text Alignments */
.text-center {
    text-align: center; /* Centrer le texte */
}

.text-start {
    text-align: left; /* Alignement à gauche pour certains textes */
}

.text-end {
    text-align: right; /* Alignement à droite pour certains textes */
}

/* Specific Section Styles */
.div3 img {
    max-width: 100%; /* Images fluides */
    height: auto;
}

/* Services Section */
.sp {
    max-width: 70px;
    height: auto;
}

/* Button Styles - Specific */
.btn-white {
    background-color: #fff;
    color: #bc1a27;
    text-decoration: none;
    padding: 12px 24px; /* Bouton plus grand */
    border-radius: 8px; /* Bordure arrondie */
    border: 1px solid #bc1a27; /* Bordure rouge */
}

.btn-white:focus,
.btn-white:hover {
    background-color: #bc1a27;
    color: #fff;
    text-decoration: none;
}

/* Table Styling */
table {
    width: 100%;
    border-collapse: collapse;
}

table, th, td {
    border: 1px solid #ddd; /* Bordure légère pour les tables */
}

th, td {
    padding: 8px;
    text-align: left;
}

th {
    background-color: #f4f4f4;
}

/* Footer Styles */
footer {
    background-color: #111214;
    color: #fff;
    padding: 20px;
    text-align: center;
}

footer p {
    font-family: 'Arial', sans-serif;
    font-size: 14px;
}

/* Responsive Design Adjustments */
@media (max-width: 768px) {
    /* Reduire les tailles de texte pour les petits écrans */
    .FontsMontserrat {
        font-size: 1.1rem;
    }

    .FontArial {
        font-size: 1rem;
    }

    /* Mise en page responsive */
    .navbar-collapse {
        text-align: center;
    }

    .col-sm {
        margin-bottom: 20px;
    }

    /* Services */
    #service .row {
        flex-direction: column;
    }

    /* Ajustement des boutons pour mobile */
    .btn-white {
        padding: 10px 20px;
    }
}
/* CSS Document */

/* Font Face */
@font-face {
    font-family: "Montserrat";
    src: url("fonts/Montserrat.ttf") format("truetype");
}

/* Font Styling */
.FontsMontserrat {
    font-family: "Montserrat", sans-serif;
    font-weight: 700; /* Pour un texte en gras */
}

.FontArial {
    font-family: "Arial", sans-serif;
}

body {
    background-color: #111214;
}

.div1 {
    padding: 2% 2%;
    height: auto;
    background-color: none;
}

.div2 {
    padding: 5% 5%;
    height: auto;
    background-color: none;
}

.div3 {
    padding: 0% 0%;
    height: auto;
    background-color: none;
}

.bg-gry {
    height: auto;
    background-color: #f7f7f7;
}

.bg-wht {
    height: auto;
    background-color: #fff;
}

.bg-rd {
    height: auto;
    background-color: #bc1a27;
}

.brand {
    max-width: 120px;
    height: auto;
}

.sp {
    max-width: 70px;
    height: auto;
}

.menu {
    max-width: 30px;
    height: auto;
}

/* Responsive adjustments */
@media screen and (max-width: 600px) {
    .brand {
        max-width: 100px;
    }
    .sp {
        max-width: 50px;
    }	
    .menu {
        max-width: 20px;
    }
}

.link1 {
    color: #111214;
    text-decoration: none;
}

.link1:focus,
.link1:hover {
    color: #bc1a27;
    text-decoration: none;
}

.link2 {
    color: #fff;
    text-decoration: none;
}

.link2:focus,
.link2:hover {
    color: #bc1a27;
    text-decoration: none;
}

.btn-white {
    background-color: #fff;
    color: #bc1a27;
    text-decoration: none;
    padding: 12px 24px; /* Augmente la taille du bouton */
    border-radius: 8px; /* Ajoute un border-radius */
    border: 1px solid #bc1a27; /* Optionnel : ajoute une bordure */
}

.btn-white:focus,
.btn-white:hover {
    background-color: #bc1a27;
    color: #fff;
    text-decoration: none;
}

.textred {
    color: #bc1a27;
}

.textwhite {
    color: #fff;
}

.textblack {
    color: #000;
}