/* Styles pour les écrans plus petits (tablettes, etc.) */
@media (max-width: 992px) {

    .hero {
        flex-direction: column;
    }

    .hero .img {
        width: 100%;
        /* Prend toute la largeur */
        align-items: center;
        /* Centre horizontalement */
    }

    .hero .img .img-logo {
        width: 50%;
        /* Ajuste la taille du logo */
        margin-bottom: 20px;
        /* Espacement */
    }

    .hero .img .img-grid {
        width: 50%;
        /* Ajuste la taille de l'image */
    }

    .hero .grid {
        width: 90%;
        /* Prend plus de largeur */
        margin-top: 20px;
        /* Espacement */
    }

    .hero .grid .titre1 {
        width: 100%;
        /* Prend toute la largeur */
        text-align: center;
        /* Centre le texte */
    }

    .hero .grid .titre1 .span1,
    .hero .grid .titre1 .span2 {
        font-size: 2rem;
        /* Réduit la taille de la police */
    }

    .hero .grid .titre1 .span3 {
        font-size: 1rem;
        /* Réduit la taille de la police */
    }

    .hero .grid .titre1 .span3-sousgroup {
        margin-left: 0;
        /* Supprime la marge */
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .hero .div1 {
        flex-wrap: wrap;
        /* Permet aux images de passer à la ligne */
        justify-content: center;
        /* Centre les images */
    }

    .hero .div1 img {
        margin: 5px;
        /* Espacement */
        width: 50px;
        /* Ajuste la taille des images */
        height: 50px;
        /* Ajuste la taille des images */
    }

    .section2 .expertises-img {
        width: 90%;
        /* Prend toute la largeur */
    }

    .section2 .paragraphes {
        width: 90%;
        /* Prend toute la largeur */
        height: auto;
        /* Ajuste la hauteur */
        position: relative;
        /* Pour positionner les éléments enfants */
    }

    .section2 .paragraphes .paragraphe1,
    .section2 .paragraphes .paragraphe2,
    .section2 .paragraphes .paragraphe3,
    .section2 .paragraphes .paragraphe4 {
        position: relative;
        /* Positionne les paragraphes les uns en dessous des autres */
        width: 100%;
        /* Prend toute la largeur */
        margin-bottom: 20px;
        /* Espacement */
        left: auto;
        /* Supprime le positionnement */
        right: auto;
        /* Supprime le positionnement */
        text-align: center;
        /* Centre le texte */
    }

    .section2 .paragraphes .logo {
        display: block;
        position: relative;
        /* Positionne le logo au centre */
        width: 150px;
        /* Ajuste la taille du logo */
        margin: 20px auto;
        /* Centre le logo */
    }

    .section3 h1 {
        font-size: 2.5rem;
        /* Ajuste la taille de la police */
        top: 20px;
        /* Ajuste la position */
        right: 5%;
        /* Ajuste la position */
        width: 90%;
        /* Prend toute la largeur */
        text-align: center;
        /* Centre le texte */
    }

    .section3 h2 {
        font-size: 1.2rem;
        /* Ajuste la taille de la police */
        top: 80px;
        /* Ajuste la position */
        right: 5%;
        /* Ajuste la position */
        width: 90%;
        /* Prend toute la largeur */
        text-align: center;
        /* Centre le texte */
    }

    .section3 p {
        font-size: 1rem;
        /* Ajuste la taille de la police */
        top: 180px;
        /* Ajuste la position */
        right: 5%;
        /* Ajuste la position */
        width: 90%;
        /* Prend toute la largeur */
        text-align: center;
        /* Centre le texte */
    }

    .section3 .lien-contact {
        top: 350px;
        /* Ajuste la position */
        right: 5%;
        /* Ajuste la position */
        width: auto;
        /* Ajuste la largeur */
    }

    .services-cards {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        /* Ajuste la largeur minimale */
    }

    .services .solutions_it .solution_it {
        width: 90%;
        /* Prend toute la largeur */
    }

    .team-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        /* Ajuste la largeur minimale */
    }

    .contact-form-container {
        padding: 1rem;
        /* Réduit le padding */
    }

    .footer-container {
        flex-direction: column;
        /* Empile les éléments */
        text-align: center;
        /* Centre le texte */
    }

    .footer-links,
    .footer-contact,
    .footer-social {
        margin-bottom: 20px;
        /* Espacement */
    }

    .footer-logo img {
        max-width: 120px;
        /* Ajuste la taille du logo */
    }

    .footer-links ul {
        padding: 0;
        /* Supprime le padding */
    }

    .footer-links ul li {
        margin: 5px 0;
        /* Espacement */
    }

    .footer-social .social-icons {
        justify-content: center;
        /* Centre les icônes */
    }

    .team-card {
        margin-bottom: 20px;
        /* Espacement */
    }

    .team-info {
        padding: 1rem;
        /* Réduit le padding */
    }

    .team-info h3 {
        font-size: 1.2rem;
        /* Réduit la taille de la police */
    }

    .team-info .contact-cursus {
        font-size: 12px;
        /* Réduit la taille de la police */
    }

    .contact-form input,
    .contact-form textarea {
        padding: 0.6rem;
        /* Réduit le padding */
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .btn-submit {
        padding: 0.6rem 1.2rem;
        /* Réduit le padding */
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .section-title {
        font-size: 2rem;
        /* Réduit la taille de la police */
    }

    .adn-p {
        font-size: 1rem;
        /* Réduit la taille de la police */
    }

    .services-details .detail h4 {
        font-size: 1.3rem;
        /* Réduit la taille de la police */
    }

    .services-details .detail p {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .theme-card {
        padding: 1.5rem;
        /* Réduit le padding */
    }

    .theme-card h3 {
        font-size: 1.2rem;
        /* Réduit la taille de la police */
    }

    .theme-card p {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .contact-details a {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .contact-details i {
        font-size: 1rem;
        /* Réduit la taille de la police */
    }

    .footer-contact p {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .footer-contact a {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .footer-bottom p {
        font-size: 0.8rem;
        /* Réduit la taille de la police */
    }

    .nav-links {
        position: fixed;
        /* Position fixe */
        top: 0;
        /* Collé en haut */
        left: 0;
        /* Collé à gauche */
        width: 100%;
        /* Prend toute la largeur */
        height: 100vh;
        /* Prend toute la hauteur */
        background-color: rgba(0, 0, 0, 0.9);
        /* Fond sombre */
        display: flex;
        flex-direction: column;
        /* Empile les liens */
        align-items: center;
        /* Centre horizontalement */
        justify-content: center;
        /* Centre verticalement */
        z-index: 1000;
        /* Au-dessus de tout */
        transform: translateX(-100%);
        /* Cache la navigation */
        transition: transform 0.3s ease-in-out;
        /* Animation */
    }

    .nav-links.open {
        transform: translateX(0);
        /* Affiche la navigation */
    }

    .nav-links li {
        margin: 20px 0;
        /* Espacement */
    }

    .nav-links a {
        font-size: 1.5rem;
        /* Taille de la police */
        color: white;
        /* Couleur du texte */
    }

    .logo img {
        width: 100px;
        /* Ajuste la taille du logo */
    }

    .navbar {
        padding: 1rem 5%;
        /* Ajuste le padding */
    }

    .contact {
        display: inline-block;
        /* Affiche le contact */
        margin-top: 20px;
        /* Espacement */
    }

    .nav-item {
        margin: 0;
        /* Supprime la marge */
    }

    .nav-item::after {
        display: none;
        /* Supprime la ligne */
    }

    .nav-item:hover {
        color: white;
        /* Couleur du texte */
    }

    .nav-item.active {
        color: white;
        /* Couleur du texte */
    }

    .nav-toggle {
        display: block;
        /* Affiche le bouton */
        background: none;
        /* Supprime le fond */
        border: none;
        /* Supprime la bordure */
        cursor: pointer;
        /* Curseur */
        position: absolute;
        /* Position absolue */
        top: 1rem;
        /* Position */
        right: 5%;
        /* Position */
        z-index: 1001;
        /* Au-dessus de tout */
    }

    .nav-toggle .bar {
        width: 30px;
        /* Largeur */
        height: 3px;
        /* Hauteur */
        background-color: var(--primary-color);
        /* Couleur */
        margin: 5px auto;
        /* Espacement */
        transition: all 0.3s ease-in-out;
        /* Animation */
        display: block;
        /* Affiche la barre */
    }

    .nav-toggle.open .bar:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
        /* Animation */
    }

    .nav-toggle.open .bar:nth-child(2) {
        opacity: 0;
        /* Animation */
    }

    .nav-toggle.open .bar:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
        /* Animation */
    }

    .nav-toggle {
        display: block;
        /* Affiche le bouton */
    }

    .nav-links {
        display: none;
        /* Cache la navigation */
    }

    .nav-links.open {
        display: flex;
        /* Affiche la navigation */
    }

    .nav-toggle {
        display: block;
        /* Affiche le bouton */
    }
}

/* Styles pour les téléphones */
@media (max-width: 576px) {

    .section2 .expertises-img {
        width: 66%;
        opacity: 1;
        transform: translateX(0);
    }

    .contact-link {
        display: block;
    }

    .adn {
        height: auto;
    }

    .adn .adn-p {
        text-align: justify;
        width: auto;
        font-size: 1rem;
        margin: 10px 5%;

    }

    .hero .grid .titre1 .span1 {
        font-size: 1.5rem;
        /* Réduit la taille de la police */
    }

    .hero .grid .titre1 .span2 {
        font-size: 1.3rem;
        /* Réduit la taille de la police */
    }

    .hero .grid .titre1 .span3 {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .hero .grid .titre1 .span3-sousgroup {
        font-size: 0.8rem;
        /* Réduit la taille de la police */
    }

    .section3 h1 {
        font-size: 2rem;
        /* Réduit la taille de la police */
    }

    .section3 h2 {
        font-size: 1rem;
        /* Réduit la taille de la police */
    }

    .section3 p {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .services-cards {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        /* Ajuste la largeur minimale */
    }

    .team-grid {
        grid-template-columns: 1fr;
        /* Une seule colonne */
    }

    .team-card {
        text-align: center;
        /* Centre le texte */
    }

    .team-image {
        margin: 0 auto;
        /* Centre l'image */
    }

    .team-info .contact-cursus {
        text-align: left;
        /* Alignement du texte */
    }

    .footer-container {
        text-align: center;
        align-items: center;
        /* Alignement du texte */
    }

    .footer-links,
    .footer-contact,
    .footer-social {
        margin-bottom: 20px;
        /* Espacement */
    }


    .contact-form-container {
        padding: 0.5rem;
        /* Réduit le padding */
    }

    .contact-form label {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .contact-form input,
    .contact-form textarea {
        font-size: 0.8rem;
        /* Réduit la taille de la police */
    }

    .btn-submit {
        font-size: 0.8rem;
        /* Réduit la taille de la police */
    }

    .section-title {
        font-size: 1.8rem;
        /* Réduit la taille de la police */
    }

    .adn-p {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .services-details .detail h4 {
        font-size: 1.1rem;
        /* Réduit la taille de la police */
    }

    .services-details .detail p {
        font-size: 0.8rem;
        /* Réduit la taille de la police */
    }

    .theme-card h3 {
        font-size: 1rem;
        /* Réduit la taille de la police */
    }

    .theme-card p {
        font-size: 0.8rem;
        /* Réduit la taille de la police */
    }

    .contact-details a {
        font-size: 0.8rem;
        /* Réduit la taille de la police */
    }

    .contact-details i {
        font-size: 0.9rem;
        /* Réduit la taille de la police */
    }

    .footer-contact p {
        font-size: 0.8rem;
        /* Réduit la taille de la police */
    }

    .footer-contact a {
        font-size: 0.8rem;
        /* Réduit la taille de la police */
    }

    .footer-bottom p {
        font-size: 0.7rem;
        /* Réduit la taille de la police */
    }

    .logo img {
        width: 80px;
        /* Ajuste la taille du logo */
    }

    .navbar {
        padding: 0.8rem 5%;
        /* Ajuste le padding */
    }

    .nav-toggle {
        top: 0.8rem;
        /* Ajuste la position */
    }

    .nav-toggle .bar {
        width: 25px;
        /* Ajuste la largeur */
        height: 2px;
        /* Ajuste la hauteur */
    }

    .nav-links li {
        margin: 15px 0;
        /* Ajuste l'espacement */
    }

    .nav-links a {
        font-size: 1.2rem;
        /* Ajuste la taille de la police */
    }

    .contact {
        margin-top: 15px;
        /* Ajuste l'espacement */
    }

    .section2 .paragraphes .paragraph-26 {
        font-size: 12px;
        /* Ajuste la taille de la police */
    }

    .section3 h1 {
        font-size: 35px;
        /* Ajuste la taille de la police */
    }

    .section3 h2 {
        font-size: 16px;
        /* Ajuste la taille de la police */
    }

    .section3 p {
        font-size: 14px;
        /* Ajuste la taille de la police */
    }

    .section3 .lien-contact {
        font-size: 16px;
        /* Ajuste la taille de la police */
    }

    .team-info .contact-cursus {
        font-size: 11px;
        /* Ajuste la taille de la police */
    }

    .team-info .description {
        font-size: 12px;
        /* Ajuste la taille de la police */
    }

    .team-info .position {
        font-size: 14px;
        /* Ajuste la taille de la police */
    }

    .team-info .experience {
        font-size: 12px;
        /* Ajuste la taille de la police */
    }

    .contact-details a {
        font-size: 12px;
        /* Ajuste la taille de la police */
    }

    .contact-details i {
        font-size: 14px;
        /* Ajuste la taille de la police */
    }

    .footer-links h4,
    .footer-contact h4,
    .footer-social h4 {
        font-size: 16px;
        /* Ajuste la taille de la police */
    }

    .footer-links ul li a {
        font-size: 14px;
        /* Ajuste la taille de la police */
    }

    .footer-contact p {
        font-size: 14px;
        /* Ajuste la taille de la police */
    }

    .footer-contact a {
        font-size: 14px;
        /* Ajuste la taille de la police */
    }

    .footer-bottom p {
        font-size: 12px;
        /* Ajuste la taille de la police */
    }

    .themes h2 {
        font-size: 1.5rem;
        /* Ajuste la taille de la police */
    }

    .section-title {
        font-size: 1.5rem;
        /* Ajuste la taille de la police */
    }

    .adn-p {
        font-size: 0.8rem;
        /* Ajuste la taille de la police */
    }

    .services-details .detail h4 {
        font-size: 1rem;
        /* Ajuste la taille de la police */
    }

    .services-details .detail p {
        font-size: 0.7rem;
        /* Ajuste la taille de la police */
    }

    .theme-card h3 {
        font-size: 0.9rem;
        /* Ajuste la taille de la police */
    }

    .theme-card p {
        font-size: 0.7rem;
        /* Ajuste la taille de la police */
    }

    .contact-details a {
        font-size: 0.7rem;
        /* Ajuste la taille de la police */
    }

    .contact-details i {
        font-size: 0.8rem;
        /* Ajuste la taille de la police */
    }

    .footer-contact p {
        font-size: 0.7rem;
        /* Ajuste la taille de la police */
    }

    .footer-contact a {
        font-size: 0.7rem;
        /* Ajuste la taille de la police */
    }

    .footer-bottom p {
        font-size: 0.6rem;
        /* Ajuste la taille de la police */
    }

    .hero .img .img-logo {
        width: 65%;
        margin-top: 70px;
        /* Ajuste la taille du logo */
    }

    .hero .img .img-grid {
        width: 70%;
        /* Ajuste la taille de l'image */
    }

    .hero .grid {
        width: 95%;
        /* Ajuste la largeur */
    }

    .section2 .expertises-img {
        width: 95%;
        /* Ajuste la largeur */
    }

    .section2 .paragraphes {
        width: 100%;
        margin-top: 50px;
        /* Ajuste la largeur */
    }

    .services .solutions_it .solution_it {
        width: 95%;
        /* Ajuste la largeur */
    }

    .contact-form-container {
        width: 95%;
        /* Ajuste la largeur */
    }

    .footer-container {
        width: 95%;
        /* Ajuste la largeur */
    }

    .team-grid {
        width: 95%;
        /* Ajuste la largeur */
    }

    .themes {
        width: 100%;
        /* Ajuste la largeur */
    }

    .services {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-contact {
        width: 100%;
        /* Ajuste la largeur */
    }

    .adn {
        width: 100%;
        /* Ajuste la largeur */
    }

    .hero {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section2 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section3 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section4 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .navbar {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-links {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-toggle {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-toggle .bar {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-links li {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-links a {
        width: 100%;
        /* Ajuste la largeur */
    }

    .contact {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section2 .paragraphes .paragraph-26 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section3 h1 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section3 h2 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section3 p {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section3 .lien-contact {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-info .contact-cursus {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-info .description {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-info .position {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-info .experience {
        width: 100%;
        /* Ajuste la largeur */
    }

    .contact-details a {
        width: 100%;
        /* Ajuste la largeur */
    }

    .contact-details i {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer-links h4,
    .footer-contact h4,
    .footer-social h4 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer-links ul li a {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer-contact p {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer-contact a {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer-bottom p {
        width: 100%;
        /* Ajuste la largeur */
    }

    .services .solutions_it h2 {
        width: 100%;
        text-align: center;
        /* Ajuste la largeur */
    }

    .themes h2 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section-title {
        width: 100%;
        /* Ajuste la largeur */
    }

    .adn-p {
        width: 100%;
        /* Ajuste la largeur */
    }

    .services-details .detail h4 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .services-details .detail p {
        width: 100%;
        /* Ajuste la largeur */
    }

    .theme-card h3 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .theme-card p {
        width: 100%;
        /* Ajuste la largeur */
    }

    .contact-details a {
        width: 100%;
        /* Ajuste la largeur */
    }

    .contact-details i {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer-contact p {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer-contact a {
        width: 100%;
        /* Ajuste la largeur */
    }

    .dynamic-text {
        font-size: 0.9rem;
        text-align: center;
        width: 95%;
        display: flex;
        flex-direction: row;
        margin-left: 10%;
    }

    #dynamic-words {
        display: inline-block;
        /* ou block selon ton layout */
        min-height: 1.6em;
        /* Ajuste cette valeur selon la taille de ton texte */
        vertical-align: middle;
        /* Optionnel, pour un meilleur alignement */
    }

    .footer-bottom p {
        width: 100%;
        /* Ajuste la largeur */
    }


    .hero .img .img-grid {
        width: 40%;
        margin-top: 0;
        /* Ajuste la largeur */
    }

    .hero .grid {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section2 .expertises-img {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section2 .paragraphes {
        width: 100%;
        /* Ajuste la largeur */
    }

    .services .solutions_it .solution_it {
        width: 100%;
        /* Ajuste la largeur */
    }

    .contact-form-container {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer-container {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-grid {
        width: 100%;
        /* Ajuste la largeur */
    }

    .themes {
        width: 100%;
        /* Ajuste la largeur */
    }

    .services {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-contact {
        width: 100%;
        /* Ajuste la largeur */
    }

    .adn {
        width: 100%;
        /* Ajuste la largeur */
    }

    .hero {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section2 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section3 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section4 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .navbar {
        width: 100%;
        /* Ajuste la largeur */
    }

    .footer {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-links {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-toggle {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-toggle .bar {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-links li {
        width: 100%;
        /* Ajuste la largeur */
    }

    .nav-links a {
        width: 100%;
        /* Ajuste la largeur */
    }

    .contact {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section2 h1 {
        width: 100%;
        line-height: 18px;
        margin-bottom: 20px;
        font-size: 17px;
        text-align: center;
        /* Ajuste la largeur */
    }

    .section2 h2 {
        width: 100%;
        line-height: 18px;
        margin-bottom: 20px;
        font-size: 17px;
        text-align: center;
        /* Ajuste la largeur */
    }

    .section3 h1 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section3 h2 {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section3 p {
        width: 100%;
        /* Ajuste la largeur */
    }

    .section3 .lien-contact {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-info .contact-cursus {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-info .description {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-info .position {
        width: 100%;
        /* Ajuste la largeur */
    }

    .team-info .experience {
        width: 100%;
        /* Ajuste la largeur */
    }

    .contact-details a {
        width: 100%;
        /* Ajuste la largeur */
    }

    .contact-details i {
        width: 100%;
        /* Ajuste la largeur */
    }

    .carousel-container {
        width: 90%;
    }

    .adn-li {
        width: 90%;
    }

    .logo-header img {
        width: 90px;
        margin: 0;
    }
}