@media screen and (max-width: 600px) {
    .detailVoyagesOrganises .carousel-indicators {
        right: -45px !important;
        left: auto !important;
        cursor: pointer;
        overflow: scroll;
    }
    .ui-datepicker td span,
    .ui-datepicker td a {
        width: 1.9rem !important;
        padding: 0rem !important;
        text-align: center !important;
    }
    .ui-datepicker table tr {
        width: 98% !important;
    }
    .ui-datepicker th {
        padding: 0.7em .9em !important;
    }
}

@media (max-width:500px) {
    .filter-bg {
        height: 370px;
        color: #ffffff !important;
        background-image: linear-gradient(to bottom, rgba(0, 14, 255, 32%), rgba(0, 0, 0, 65%)), url('../image/slider8.png');
        background-size: cover;
        background-repeat: no-repeat;
        background-position: right;
    }
    .filter-bg .fa-map-marker-alt {
        color: #ffffff !important;
    }
    .filter-bg .fa-calendar {
        color: #ffffff !important;
    }
    .filter-bg .fa-door-open {
        color: #ffffff !important;
    }
    .filter-bg .label-pos {
        color: #ffffff !important;
    }
    .filter-bg input {
        color: #ffffff !important;
    }
    .filter-bg select {
        color: #ffffff !important;
        background: #191a4f !important;
    }
    .slider-text {
        top: 50%;
        right: auto;
        left: auto;
    }
    .slider-text h1 {
        color: #ffffff;
        font-weight: 800;
        text-align: center;
    }
    .filter .row {
        margin-bottom: 10px;
        margin-right: -10px !important;
        margin-left: -10px !important;
    }
    .VoyagesOrganises div#plus {
        padding: 0;
        margin: 0;
    }
    .body {
        margin: 25px 0;
    }
    /*div#selector {
        z-index: 1;
        margin: 0;
        margin-top: 10px;
        width: fit-content;
    }*/
    div#selector {
        width: 100%;
        margin-left: 0;
        margin-top: -520px;
    }
    .selector {
        display: none;
    }
    .sl-nav1 {
        display: none;
    }
    .detailsBox h5 {
        font-size: small;
    }
    h2 {
        font-size: medium !important;
    }
    .clipy-section1 {
        display: none;
    }
    .clipy-section {
        display: none;
    }
    .navbar {
        font-family: 'Poppins', sans-serif !important;
        background-color: rgba(62, 178, 255, 0.4);
        position: absolute;
        font-weight: bold;
        /* padding-bottom: 1.5rem !important; */
        z-index: 100;
    }
    a.nav-link:hover {
        border-bottom: none;
    }
    a.nav-link:active {
        border-bottom: none;
    }
    .navbar-collapse {
        position: relative;
        left: 20rem;
        top: -20rem;
    }
    nav.navbar.navbar-expand-lg {
        margin-top: 0px;
        width: 100%;
        margin-top: 0px;
        font-family: 'Poppins', sans-serif !important;
        background-color: #ffffff;
        position: absolute;
        font-weight: bold;
        /* padding-bottom: 1.5rem !important; */
        z-index: 1000000;
        opacity: 100%;
    }
    .animate.fadeInTopRight {
        animation: fadeInTopRight 0s forwards;
        --animate-duration: 1s;
        --animate-delay: 1s;
        --animate-repeat: 1;
    }
    @keyframes fadeInTopRight {
        0% {
            opacity: 0;
        }
        100% {
            opacity: 1;
            left: 0rem;
            top: 0rem;
        }
    }
    .section-circuit-excursion {
        margin-top: 8%;
    }
    .section-voyages-organises.container {
        margin-top: 10%;
    }
    .section-voyages-organises h1 {
        font-size: 30px;
    }
    .section-voyages-organises .trait {
        display: none;
    }
    .section-circuit-excursion span {
        font-size: small;
    }
    .section-circuit-excursion h1 {
        font-size: 30px;
        margin: 0;
    }
    .section-circuit-excursion .trait {
        display: none;
    }
    .footer-section {
        clip-path: polygon(0 0%, 100% 0, 100% 100%, 0% 100%);
    }
    .footer .logo {
        width: 13rem;
        margin-top: auto;
        margin-bottom: 30px;
    }
    .navbar img {
        margin-left: -0.1rem !important;
    }
    .logo img {
        width: 10rem !important;
        margin-right: 0 !important;
    }
    .upper-bar {
        display: none !important;
    }
    .borderdiv {
        border: 1px solid #ffffff;
        padding: 0.5em;
    }
    .hotel-title-index {
        margin-top: -35% !important;
    }
    .filter {
        color: #ffffff !important;
        top: -13em;
        font-size: 14px;
        font-family: 'Poppins', sans-serif !important;
        width: 100%;
        margin: 0;
        text-align: justify;
        box-shadow: none;
        padding-left: 10px;
        padding-right: 10px;
    }
    .filter .f2 {
        width: 95%;
        margin: 0.3rem;
    }
    .filter .f1 {
        margin: 0.3rem;
    }
    .filter .row {
        margin-bottom: 0rem;
    }
    .filter .btn {
        width: 90%;
        margin-top: 0.4rem;
    }
    /* .slide-interne {
        margin-top: 0px; 
    } */
    .slider .carousel-item {
        height: 13rem;
    }
    .slider {
        display: flex;
    }
    .section-circuit-excursion .pays {
        width: 90%;
        bottom: -0.5rem;
        left: 0.5rem;
    }
    .section-circuit-excursion .col-6.col-md-6.mid {
        HEIGHT: 162PX;
    }
    .section-circuit-excursion img#photo1 {
        HEIGHT: 14REM !important;
        PADDING: 0REM !important;
    }
    .section-circuit-excursion .nbre-jour-interne {
        width: 90%;
    }
    .section-circuit-excursion .cadre-contenue-interne {
        padding: 3rem 0rem 0rem 0rem;
        width: 90%;
        top: -9.7rem;
        height: 9.2REM;
    }
    .section-circuit-excursion .cadre-image-interne {
        height: 163px;
    }
    .filtre-liste-hotel a.btn {
        width: 100% !important;
    }
    img.tripadvisor {
        margin-left: 0rem;
        margin-top: 0rem;
    }
    .HotelEnTunisie .btnlisthotel .btn {
        margin-top: 0rem;
    }
    .HotelEnTunisie .btnlisthotel.w-100 {
        margin-left: 1rem !important;
    }
    .HotelEnTunisie .btnlisthotel2.w-100 {
        margin-left: 1rem !important;
    }
    .HotelEnTunisie small {
        margin-top: 0rem !important;
        margin-left: 1rem;
    }
    .HotelEnTunisie h5.card-title {
        margin-top: 0rem !important;
    }
    .HotelEnTunisie .btnlisthotel2 .btn {
        margin-top: 1rem;
    }
    .HotelEnTunisie table {
        margin-top: 0rem !important;
    }
    .table thead {
        border: none !important;
        clip: rect(0 0 0 0) !important;
        height: 1px !important;
        margin: -1px !important;
        overflow: hidden !important;
        padding: 0 !important;
        position: absolute !important;
        width: 1px !important;
    }
    .table tr {
        width: auto !important;
    }
    .table td,
    table tr {
        border-top: 0px solid #eee !important;
        border-bottom: 1px solid #d4d4d4 !important;
        display: block !important;
        font-size: small !important;
        text-align: left !important;
        margin-top: 0rem !important;
    }
    .table td::before {
        content: attr(data-label) !important;
        float: left !important;
        font-weight: bold !important;
        text-transform: uppercase !important;
        width: 50%;
        text-align: left;
        font-size: x-small;
    }
    .table .disp {
        display: none !important;
    }
    .ChambreBox {
        height: 62px;
    }
    .warpper .tab {
        WIDTH: 30%;
    }
    label#one-tab,
    label#two-tab,
    label#three-tab {
        font-size: 10px !important;
    }
    .ReservationHotel .btnlisthotel2 .btn {
        width: 100%;
    }
    .carousel-indicators img {
        width: 3rem;
        margin: 3px;
        height: 2rem;
    }
    .detailVoyagesOrganises .carousel-indicators {
        left: -40px !important;
        cursor: pointer;
    }
    .detailsBox .btnReserver a {
        margin-top: 1rem;
        background-image: linear-gradient(to right, #3eb2ffcc, #071230);
        color: #fff;
        float: none;
        width: 100%;
    }
    .VoyagesOrganises select.custom-select.form-control.form-control-sm {
        width: 100%;
    }
    .billetrie input.btn.btn-primary {
        WIDTH: 100%;
    }
    .billetrie label {
        margin-left: 1rem;
    }
    .form-check-input {
        margin-left: 0rem !important;
    }
    .CircuitExcursion select.custom-select.form-control.form-control-sm {
        width: 100%;
    }
    .CircuitExcursion input {
        width: 100%;
    }
    .Croisier .box-content {
        BOX-SHADOW: 0REM 1REM 3REM 0.2REM #ddd;
        MARGIN-BOTTOM: 1rem;
    }
    .CircuitExcursion .card.card3 {
        margin-bottom: 1rem !important;
        width: 100%;
    }
    select.custom-select.form-control.form-control-sm {
        BORDER-RADIUS: 0REM !important;
    }
    .ReservationM button.btn.btn-primary {
        width: 100%;
    }
    .wrapper {
        display: none;
    }
    .vl1 {
        display: none;
    }
    .vl2 {
        display: none;
    }
    .icon-text {
        display: flex;
        flex-wrap: wrap;
        margin-top: 20px;
        margin-bottom: 20px;
        justify-content: center;
    }
    /* .rooms {
        display: none;
    } */
    .section-title {
        margin: 0;
    }
    .trait3 {
        display: none;
    }
    .titleomra {
        width: 100%;
        font-size: 20px;
    }
    .omra {
        width: 100%;
    }
    .omrafield {
        width: 100%;
    }
    .omra h1 {
        color: #071230;
        font-size: 2.5em;
        font-weight: bold;
        text-align: center;
        margin: 0;
    }
    .omra span {
        font-size: 15px;
    }
    .form-select {
        margin-right: 40px;
    }
    .section-title span {
        font-size: 16px;
    }
    .section-title h1 {
        font-size: 22px;
    }
    .autrement h1 {
        font-size: 37px !important;
    }
    .paradis h1 {
        font-size: 60px !important;
    }
    .omraindex img {
        height: 100px !important;
    }
    .section-circuit-excursion h1 {
        font-size: 22px;
    }
    .section-circuit-excursion span {
        font-size: 16px;
    }
    .stage {
        padding: 0px;
    }
    .hotelindex {
        margin-top: 50px;
    }
    .section-titlee h1 {
        font-size: 1.3rem !important;
    }
    .section-titlee {
        padding-top: 8rem !important;
    }
    .home-ico {
        display: none;
    }
    #menu {
        margin-top: 10px;
    }
    .slide-interne .carosel-contact-one {
        background-size: contain;
        height: 300px;
    }
    .slide-interne .carosel-voyage-one {
        background-size: contain;
        height: 310px;
    }
    .slide-interne .carosel-carte-one {
        background-size: contain;
        height: 302px;
    }
    .slide-interne .carosel-hotels-one {
        background-size: contain;
        height: 330px;
    }
    .loading {
        display: none;
    }
    .slide-interne .carosel-omra-one {
        background-size: contain;
        height: 300px
    }
    .slide-interne .carosel-event-one {
        background-size: contain;
        height: 300px
    }
    .slide-interne .carosel-excursion-one {
        background-size: contain;
        height: 300px
    }
    .tab {
        cursor: pointer;
        padding: 10px 20px;
        margin: 0px 2px;
        background: #4685C4;
        display: inline-block;
        color: #fff;
        border-radius: 3px 3px 0px 0px;
        box-shadow: 0 0.5rem 0.8rem #00000080;
    }
    .carte-title {
        font-size: 1.7rem !important;
    }
    #menu li {
        font-family: 'Poppins';
        float: left;
        margin: 5px 10px 0px 10px;
    }
    .omratrait {
        display: none;
    }
    .carousel-inner {
        height: 250px;
    }
    .panels {
        font-size: 11px;
    }
    .circuittitre {
        font-size: 1.7rem !important;
    }
    .titre-page-intern {
        font-size: 1.7rem !important;
    }
    .slide-interne .carosel-billeterie-one {
        height: 300px;
    }
    #index-carousel {
        display: none;
    }
    .carousel-control-next {
        display: none;
    }
    .carousel-control-prev {
        display: none;
    }
    .spanevent {
        font-size: 15px;
        font-family: 'Permanent Marker', cursive !important;
    }
    .indextitle {
        font-family: 'Permanent Marker', cursive !important;
    }
    /* .omra-slide-tit{
        padding-top: 9rem !important;
    } */
    .slide-interne .carosel-billeterie-one {
        background-size: contain !important;
    }
}