@media screen and (max-width: 1049px) {
    .affiche {
        transition: .3s;
        border-radius: 0 0 10px 10px;
        width: 247px;
        height: 382px;
    }

    .affiche:hover {
        transform: scale(1.2);
        border-radius: 10px 10px 10px 10px;
    }

    .link_activities {
        width: 247px;
        text-align: center;
        border-radius: 2%;
    }

    .content_img {
        width: 247px;
        height: 382px;
    }

    #page_haches {
        background-attachment: fixed;
        background-size: cover;
        padding-bottom: 4%;
        padding-top: 4%;
    }

    #page_haches .content {
        background-color: rgba(0,0,0,.4);
        padding: 2%;
        width: 90%;
    }

    #page_haches .content .presentation {
        display: flex;
    }

    .desc {
        width: 98%;
    }

    #page_haches .content .presentation p {
        margin-top: 2%;
        width: 100%;
        color: white;
        font-size: 18px;
    }
    
    .securite {
        margin-top: 2%;
        font-size: 16px;
        font-weight: bold;
        color: #D04A4A;
        text-align: center;
        border-top: 1px solid rgba(208,74,74,.3);
        padding-top: 2%;
    }

    #page_haches .content .presentation img {
        width: 100%;
    }

    #page_haches .content .presentation .title {
        font-size: 22px;
        width: 100%;
        text-align: center;
        font-weight: bold;
        color: #D04A4A;
    }

    #page_haches .content .presentation .securite {
        font-size: 12px;
        color: #D04A4A;
        font-style: italic;
        text-align: right;
    }

    .infos_details_haches {
        color: white;
        text-align: center;
    }

    .personnes_par_cibles {
        border: 2px solid red;
        display: flex;
        flex-direction: column;
        margin-top: 4%;
        text-align: center;
        color: white;
    }

    .cible {
        margin-top: 10%;
    }

    .informations_haches {
        display: flex;
        margin: auto;
        flex-direction: column;
    }

    .infos_details_haches {
        color: white;
        text-align: center;
        width: 100%;
        margin-top: 6%;
    }

    .infos_details_haches p {
        font-style: italic;
    }

    .icon_description {
        margin-bottom: 6%;
        color: #D04A4A;
    }

    .btn-booking {
        transition: .4s;
        background-color: #D04A4A;
        padding: 1%;
        width: 50%;
        color: white;
        margin:auto;
        display: block;
        margin-top: 4%;
        text-align: center;
        text-decoration: none;
    }

    .btn-booking:hover {
        background-color: #d04a4a7c;
    }

    .apercu_en_images {
        display: flex;
        flex-direction: column;
        margin-top: 4%;
    }

    .apercu_en_images img {
        margin-top: 2%;
    }

    .activities {
        margin-top: 5%;
        display: flex;
        flex-direction: column;
        width: 98%;
    }

    .activities .link_activities {
        margin-top: 2%;
    }

    .our-activities {
        text-align: center;
        font-weight: bold;
        color:#D04A4A;
    }

    .more-infos-mobile {
        margin-top: 4%;
    }

    .submenu a {
        text-align: center;
        color: white;
    }

    .menu-mobile a {
        text-align: center;
        color: white;
    }

    #container-img {
        width: 75%;
        overflow-x: hidden;
        white-space: nowrap;
    }

    #content-img {
        display: flex;
        white-space: nowrap;
        animation: scrollAnimation 10s linear infinite;
    }

    #content-img img {
        margin-left: 3%;
    }

    #scroll-left-button, #scroll-right-button {
        padding: 2%;
        background-color: #D04A4A;
        border: 2px solid #D04A4A;
        color: white; 
        border-radius: 15%;
    }

    .section-img {
        background-color: rgb(36,35,35);
        display: flex; 
        width: 98%; 
        margin-top: 4%; 
        margin-bottom: 4%;
        padding: 1%;
    }
}

@media screen and (min-width: 1050px) {
    .submenu {
        display: flex;
        flex-direction: column;
        visibility: hidden;
        text-align: left;
        background-color: rgba(0,0,0,.8);
        margin-top: 4%;
        width: 100%;
      }

      .open-submenu {
        
        z-index: 10000;
      }

      .submenu a {
        padding-top: 4%;
        text-align: center;
        display: block;
        width: 100%;
      }

      .our-activities {
        visibility: visible;
      }

    .submenu a:hover {
        background-color: #D04A4A;
        transition: .4s;
    }

    .new-room {
        color:#D04A4A;
        font-size: .4vw;
    }

    .open-submenu:hover .submenu {
    visibility: visible;
    color: #D04A4A;
    border-bottom: 4px solid #D04A4A;
    transition: 0.4s;
    }

    .affiche {
        transition: .3s;
        border-radius: 0 0 10px 10px;
        width: 247px;
        height: 382px;
    }
    
    .affiche:hover {
        transform: scale(1.2);
        border-radius: 10px 10px 10px 10px;
    }
    
    .link_activities {
        width: 247px;
        text-align: center;
        border-radius: 2%;
    }
    
    .content_img {
        width: 247px;
        height: 382px;
    }
    
    #page_haches {
        background-attachment: fixed;
        background-size: cover;
        padding-bottom: 4%;
        padding-top: 4%;
    }
    
    #page_haches .content {
        background-color: rgba(0,0,0,.4);
        padding-left: 1%;
        padding-bottom: 1%;
        width: 60%;
    }

    .desc {
        width: 70%;
    }
    
    #page_haches .content .presentation {
        padding-top: 2%;
        display: flex;
        align-items: flex-start;
    }
    
    #page_haches .content .presentation p {
        color: white;
        font-size: 1.2vw;
        padding: 2%;
    }

    #page_haches .content .presentation img {
        width: 50%;
        height: 250px;
        transition: .4s;
    }
    
    #page_haches .content .presentation img:hover {
        transform: scale(1.5) rotate(-15deg);
    }
    #page_haches .content .presentation .title {
        font-size: 1.4vw;
        text-align: center;
        font-weight: bold;
        color: #D04A4A;
    }
    
    .securite {
        margin-top: 2%;
        font-size: 1.2vw;
        font-weight: bold;
        color: #D04A4A;
        text-align: center;
    }
    
    .infos_details_haches {
        color: white;
        text-align: center;
        width: 100%;
    }

    .infos_details_haches p {
        font-style: italic;
    }
    
    .personnes_par_cibles {
        display: flex;
        margin-top: 4%;
        text-align: center;
        color: white;
    }

    .informations_haches {
        display: flex;
        margin-top: 4%;
    }

    .icon_description {
        margin-bottom: 8%;
        color: #D04A4A;
    }

    .btn-booking {
        transition: .4s;
        background-color: #D04A4A;
        padding: 1%;
        width: 30%;
        color: white;
        margin:auto;
        display: block;
        margin-top: 2%;
        text-align: center;
        text-decoration: none;
    }

    .btn-booking:hover {
        background-color: #d04a4a7c;
    }

    .apercu_en_images {
        display: flex;
        margin-top: 4%;
    }
    .activities {
        margin-top: 5%;
        display: flex;
        width: 98%;
    }

    #container-img {
        width: 95%;
        overflow-x: hidden;
        white-space: nowrap;
    }

    #content-img {
        display: flex;
        white-space: nowrap;
        animation: scrollAnimation 10s linear infinite;
    }

    #content-img img {
        margin-left: 1%;
    }

    #scroll-left-button, #scroll-right-button {
        padding: 2%;
        background-color: #D04A4A;
        border: 2px solid #D04A4A;
        color: white; 
        border-radius: 15%;
    }

    .section-img {
        display: flex; 
        width: 95%; 
        margin-top: 4%; 
        margin-bottom: 4%;
    }
}