@media (max-width: 1079px) {
    * {
        box-sizing: border-box;
    }
    
    /* passer body (et tous les éléments de largeur fixe) en largeur automatique */

    body {
        width: auto;
        margin: 0;
        padding: 0;
    }
    
    /* fixer une largeur maximale de 100% aux éléments potentiellement problématiques */

    img,
    textarea,
    input,
    iframe,
    object,
    embed,
    video {
        max-width: 100%;
    }
    
    /* conserver le ratio des images */

    img {
        /*height: auto;*/
    }

    /* Customized message */
    /*
    body:before {
        content: "Mobile version";
        display: block;
        text-align: center;
        font-style: italic;
        color: #777;
    }
    */
    
    .navbar-nav {
        --bs-nav-link-padding-y: 0.3rem;
    }
    
    .navbar-collapse.collapse.show {
        position: absolute;
        /*background-color: var(--color-beige);*/
        background-color: var(--bs-body-bg);
        /*border: solid 1px var(--color-yellow);*/
        border: solid 1px var(--color-grey);
        width: 100%;
        top: 65px;
        left: 0;
    }

    .nav-icon {
        height: 40px;
    }
    
    .dropdown-menu {
        --bs-dropdown-bg: var(--bs-body-bg);
        --bs-dropdown-font-size: 15px;
        --bs-dropdown-item-padding-x: 0.5rem;
        --bs-dropdown-item-padding-y: 0.1rem;
        
        /*background-color: var(--color-beige);*/
        background-color: var(--bs-body-bg);
        margin-left: 5px;
        border-top: none;
        border-right: none;
        border-bottom: none;
        /*border-left-color: var(--color-yellow);*/
        border-left-color: var(--color-grey);
    }
    
    .nav-languages {
        .language-separator {
            padding: 0px 5px;
        }
    }
    
    .nav-link {
        font-size: 15px;
    }
    
    .dropdown-item {
        font-size: 14px;
    }

    .container-xxl {
        padding: 10px;
    }
    
    .section-main {
        padding: 30px 0;
        
        .section-head {
            padding: 0 10px;
        
            .title {
                font-size: 16px;
            }
            
            .subtitle {
                font-size: 16px;
            }
            
            .text {
            }
                
            .text-border-top {
                width: 100%;
                margin: 10px 0;
            }
        }
        
        .section-body {
        
            .section-col {
                padding: 0 10px;
                width: 100%;
            
                .text-border-left {
                    border-left: none;
                    padding-left: 0px;
                }
                
                .title {
                    font-size: 22px;
                }
                
                .subtitle {
                    font-size: 16px;
                }
            }
        }
        
        .section-body.section-mobile-text-first {
            flex-direction: column-reverse;
        }
    
        .domain-container {
            width: 50%;
            padding: 10px;
            
            .image-container {
                margin-bottom: 10px;
                
                img {
                    width: 80px;
                }
            }
        
            .title-container {
                font-size: 14px;
                margin-bottom: 10px;
            }
                
            .text-container {
                font-size: 14px;
                margin-bottom: 10px;
            }
        }
    
        .title {
            line-height: unset;
        }
    
        .text {
            margin: 15px 0;
            font-size: 14px;
        }
    }

    .section-top {
        
        .section-body {
            
            .section-col {
        
                .title {
                    font-size: 20px;
                }
            }
        }
    }
    
    .section-customers {
        padding: 15px 0;
    }
    
    .section-news {
        
        .text-container {
            padding-right: 0;
        }
    }
    
    .section-footer {
        font-size: 14px;
    
        .section-body {
        
            .section-col {
                padding: 5px;
            
                .copyright {
                    font-size: 10px;
                    margin-top: 20px;
                }
            }
        }
    }

    .contact-button,
    .contact-button:hover {
        font-size: 14px;
    }
}

@media (max-width: 640px) {
    
    .section-main {
        
        .section-body {
            flex-direction: column;
        
            .section-col {
            
                .viewer-container {
                    height: 370px;
                }
            }
        }
    }

    .section-top {
        
        .section-body {
            
            .section-col {
            
                .text-border-left {
                    text-align: center;
                }
            }
        }
    }
}