

{"id":133,"date":"2024-10-28T19:00:40","date_gmt":"2024-10-28T18:00:40","guid":{"rendered":"https:\/\/radiostreamr.com\/radio-france\/?p=133"},"modified":"2024-11-17T14:51:28","modified_gmt":"2024-11-17T13:51:28","slug":"ecoutez-en-direct-sud-radio","status":"publish","type":"post","link":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/","title":{"rendered":"Sud Radio \ud83d\udcf0 &#8211; Ecoutez en direct la Webradio"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"133\" class=\"elementor elementor-133\" data-elementor-post-type=\"post\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dce457e e-con-full e-flex e-con e-parent\" data-id=\"dce457e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9f9be1c 1995 elementor-widget elementor-widget-html\" data-id=\"9f9be1c\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"1995\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<html><head><meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<meta http-equiv=\"Content-Security-Policy\" content=\"default-src 'self' https:; script-src 'self' https: 'unsafe-inline' 'unsafe-eval'; style-src 'self' https: 'unsafe-inline'; img-src 'self' https: data:;\">\n<meta http-equiv=\"X-Frame-Options\" content=\"DENY\">\n<meta http-equiv=\"X-XSS-Protection\" content=\"1; mode=block\">\n<meta http-equiv=\"X-Content-Type-Options\" content=\"nosniff\">\n<meta http-equiv=\"Referrer-Policy\" content=\"strict-origin-when-cross-origin\">\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@300;400;700&amp;display=swap\" rel=\"stylesheet\">\n<link href=\"https:\/\/cdn.jsdelivr.net\/npm\/select2@4.1.0-rc.0\/dist\/css\/select2.min.css\" rel=\"stylesheet\">\n<style>\n  .pacific-web-radios {\n    font-family: 'Roboto', sans-serif;\n    margin: 0;\n    padding: 0;\n    background: linear-gradient(45deg, #1a1a1a, #2c2c2c, #0e4d4d);\n    background-size: 400% 400%;\n    animation: gradientBG 15s ease infinite;\n    color: #ffffff;\n    width: 100vw;\n    margin-left: -50vw;\n    left: 50%;\n    position: relative;\n    overflow-x: hidden;\n  }\n  .pacific-web-radios @keyframes gradientBG {\n    0% {\n      background-position: 0% 50%;\n    }\n    50% {\n      background-position: 100% 50%;\n    }\n    100% {\n      background-position: 0% 50%;\n    }\n  }\n  .pacific-web-radios .first-block {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    position: relative;\n    overflow: hidden;\n    height: 100vh;\n    padding-bottom: 60px;\n  }\n  .pacific-web-radios .first-block::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background-color: rgba(0, 0, 0, 0.5);\n    z-index: 1;\n  }\n  .pacific-web-radios .background-slideshow {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    z-index: 0;\n  }\n  .pacific-web-radios .slide {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0;\n    transition: opacity 1s ease-in-out;\n    background-size: cover;\n    background-position: center;\n  }\n  .pacific-web-radios .slide.active {\n    opacity: 1;\n  }\n  .pacific-web-radios .first-block-content {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: 90%;\n    max-width: 800px;\n    padding: 20px;\n    position: relative;\n    z-index: 2;\n    border-radius: 10px;\n    margin: 0 auto;\n    padding-bottom: 60px;\n  }\n  .pacific-web-radios .content-wrapper {\n    padding-top: 50px;\n    padding-left: 250px;\n    padding-right: 250px;\n    width: 100%;\n    max-width: 100%;\n    margin: 0 auto;\n    box-sizing: border-box;\n  }\n  @media (max-width: 1024px) {\n    .pacific-web-radios .content-wrapper {\n      padding-left: 40px;\n      padding-right: 40px;\n    }\n  }\n  @media (max-width: 600px) {\n    .pacific-web-radios .content-wrapper {\n      padding-left: 15px;\n      padding-right: 15px;\n    }\n  }\n  .pacific-web-radios .first-block-content,\n  .pacific-web-radios #results-container {\n    width: 100%;\n    max-width: 100%;\n    margin: 0 auto\n    padding-left: 15px;\n    padding-right: 15px;\n  }\n  .pacific-web-radios .search-and-filter-container {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 100%;\n    flex-wrap: wrap;\n  }\n  .pacific-web-radios #search-container,\n  .pacific-web-radios #category-filter-container {\n    flex: 1;\n    display: flex;\n    justify-content: center;\n    margin: 5px;\n    min-width: 200px;\n  }\n  .pacific-web-radios .select2-container {\n    min-width: 200px !important;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--single,\n  .pacific-web-radios .select2-container--default .select2-selection--multiple {\n    background-color: rgba(255, 255, 255, 0.1);\n    border: 2px solid #00ffff;\n    border-radius: 5px;\n    color: #ffffff;\n    padding: 10px;\n    font-size: 1em;\n    height: auto;\n    box-shadow: 0 0 10px #00ffff;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--single .select2-selection__rendered,\n  .pacific-web-radios .select2-container--default .select2-selection--multiple .select2-selection__rendered {\n    color: #ffffff;\n    line-height: normal;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--single .select2-selection__arrow {\n    height: 100%;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--multiple .select2-selection__choice {\n    background-color: #00ffff;\n    color: #000;\n    border: none;\n    padding: 5px 10px;\n    border-radius: 15px;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {\n    color: #000;\n    margin-right: 5px;\n  }\n  .pacific-web-radios .select2-container--default .select2-search--inline .select2-search__field {\n    color: #ffffff;\n  }\n  .pacific-web-radios .select2-dropdown {\n    background-color: #2c2c2c;\n    border: 2px solid #00ffff;\n  }\n  .pacific-web-radios .select2-container--default .select2-results__option--highlighted[aria-selected] {\n    background-color: #00ffff;\n    color: #000;\n  }\n  .pacific-web-radios .select2-container--default .select2-results__option[aria-selected=true] {\n    background-color: #008080;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--single::placeholder,\n  .pacific-web-radios .select2-container--default .select2-selection--multiple::placeholder,\n  .pacific-web-radios .select2-container--default .select2-selection--multiple .select2-search__field::placeholder {\n    color: #ffffff;\n  }\n  .pacific-web-radios .container {\n    max-width: none;\n    width: 100%;\n    padding: 20px;\n    text-align: center;\n    box-sizing: border-box;\n  }\n  .pacific-web-radios h1 {\n    text-align: center;\n    font-size: 2em;\n    margin-bottom: 20px;\n    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8), 0 0 10px #00ffff, 0 0 20px #00ffff, 0 0 30px #00ffff;\n  }\n  .pacific-web-radios .subtitle {\n    text-align: center;\n    max-width: 800px;\n    margin: 0 auto 20px;\n    font-size: 1em;\n    line-height: 1.5;\n    color: #ffffff;\n  }\n  .pacific-web-radios .results-count {\n    text-align: center;\n    margin: 60px 0 10px;\n    font-size: 1.1em;\n    color: #00ffff;\n  }\n  .pacific-web-radios .category-vignettes-container {\n    display: flex;\n    justify-content: center;\n    flex-wrap: wrap;\n    margin: 20px 0;\n  }\n  .pacific-web-radios .category-vignettes {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: center;\n  }\n  .pacific-web-radios .tag-vignette {\n    display: inline-block;\n    background-color: rgba(0, 255, 255, 0.2);\n    color: #00ffff;\n    padding: 5px 10px;\n    margin: 5px;\n    border-radius: 15px;\n    font-size: 14px;\n    cursor: pointer;\n    transition: background-color 0.3s ease;\n  }\n  .pacific-web-radios .tag-vignette:hover {\n    background-color: rgba(0, 255, 255, 0.4);\n  }\n  .pacific-web-radios .tabs {\n    display: flex;\n    justify-content: center;\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    z-index: 10;\n  }\n  .pacific-web-radios .tab {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 5px;\n    padding: 10px 20px;\n    background-color: transparent;\n    border: 2px solid #00ffff;\n    color: #00ffff;\n    cursor: pointer;\n    transition: background-color 0.3s, color 0.3s;\n  }\n  .pacific-web-radios .tab img {\n    width: 20px;\n    height: 20px;\n    filter: invert(1);\n  }\n  .pacific-web-radios .tab:hover, .pacific-web-radios .tab.active {\n    background-color: #00ffff;\n    color: #000;\n  }\n  .pacific-web-radios .tab:hover img, .pacific-web-radios .tab.active img {\n    filter: none;\n  }\n  .pacific-web-radios .tab:first-child {\n    border-top-left-radius: 5px;\n    border-bottom-left-radius: 5px;\n  }\n  .pacific-web-radios .tab:last-child {\n    border-top-right-radius: 5px;\n    border-bottom-right-radius: 5px;\n  }\n  .pacific-web-radios #results-container {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n    margin-top: 20px;\n  }\n  .pacific-web-radios .station-card {\n    background-color: rgba(255, 255, 255, 0.1);\n    border-radius: 5px;\n    padding: 15px;\n    margin-bottom: 15px;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    align-items: center;\n    width: calc(20% - 10px);\n    box-sizing: border-box;\n    border: 1px solid #00ffff;\n    box-shadow: 0 0 10px rgba(0, 255, 255, 0.3);\n    position: relative;\n    overflow: hidden;\n  }\n  .pacific-web-radios .favorite-button {\n    position: absolute;\n    top: 10px;\n    right: 10px;\n    width: 30px;\n    height: 30px;\n    background-color: transparent;\n    border: none;\n    cursor: pointer;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background-image: url('https:\/\/pacific-webtools.com\/radio-online\/wp-content\/uploads\/2024\/10\/logo-10.webp');\n    background-size: cover;\n    background-repeat: no-repeat;\n    background-position: center;\n    transition: transform 0.2s;\n  }\n  .pacific-web-radios .favorite-button.active {\n    background-image: url('https:\/\/pacific-webtools.com\/radio-online\/wp-content\/uploads\/2024\/10\/logo-11.webp');\n  }\n  .pacific-web-radios .favorite-button img {\n    display: none;\n  }\n  .pacific-web-radios .station-info {\n    width: 100%;\n    display: flex;\n    justify-content: center;\n    margin-bottom: 10px;\n  }\n  .pacific-web-radios .station-logo {\n    width: 80px;\n    height: 80px;\n    border-radius: 50%;\n    object-fit: cover;\n  }\n  .pacific-web-radios .station-details {\n    width: 100%;\n    text-align: center;\n  }\n  .pacific-web-radios .station-details h2 {\n    margin: 10px 0;\n    color: #ffffff;\n    font-size: 1.2em;\n  }\n  .pacific-web-radios .station-details p {\n    margin: 5px 0;\n    font-size: 0.9em;\n  }\n  .pacific-web-radios .play-button {\n    width: 40px;\n    height: 40px;\n    margin-top: 10px;\n    background-color: #00ffff;\n    border: none;\n    border-radius: 50%;\n    cursor: pointer;\n    padding: 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    transition: background-color 0.3s ease;\n  }\n  .pacific-web-radios .play-button:hover {\n    background-color: #00cccc;\n  }\n  .pacific-web-radios .play-button img {\n    width: 20px;\n    height: 20px;\n    filter: invert(1);\n  }\n  .pacific-web-radios .search-and-filter-container {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 100%;\n    flex-wrap: wrap;\n  }\n  .pacific-web-radios #search-container {\n    flex: 1;\n    display: flex;\n    justify-content: center;\n    margin-right: 10px;\n    min-width: 200px;\n  }\n  .pacific-web-radios #category-filter-container {\n    flex: 0 0 auto;\n    display: flex;\n    justify-content: center;\n    margin: 5px;\n    min-width: 150px;\n  }\n  .pacific-web-radios #search-input {\n    width: 100%;\n    padding: 10px;\n    font-size: 1em;\n    border: 2px solid #00ffff;\n    border-radius: 5px;\n    background-color: rgba(255, 255, 255, 0.1);\n    color: #ffffff;\n    box-shadow: 0 0 10px #00ffff;\n  }\n  .pacific-web-radios #search-input::placeholder {\n    color: #ffffff;\n  }\n  .pacific-web-radios #search-button {\n    padding: 10px;\n    font-size: 1em;\n    border: none;\n    border-radius: 5px;\n    background-color: #00ffff;\n    color: #000;\n    cursor: pointer;\n    transition: background-color 0.3s ease;\n    box-shadow: 0 0 10px #00ffff;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .pacific-web-radios #search-button img {\n    width: 20px;\n    height: 20px;\n    filter: invert(1);\n  }\n  .pacific-web-radios #search-button:hover {\n    background-color: #00cccc;\n  }\n  .pacific-web-radios .popular-radios-section {\n    margin-top: 40px;\n    background-color: rgba(255, 255, 255, 0.1);\n    border-radius: 10px;\n  }\n  @media (min-width: 1024px) {\n  .popular-radios-section {\n    padding: 50px 250px; \/* 50px pour le haut et le bas, 250px pour la gauche et la droite *\/\n  }\n}\n  @media (min-width: 768px) and (max-width: 1023px) {\n  .popular-radios-section {\n    padding: 35px; \/* 35px pour tous les c\u00f4t\u00e9s (haut, bas, gauche, droite) *\/\n  }\n}\n  @media (max-width: 767px) {\n  .popular-radios-section {\n    padding: 15px; \/* 15px pour tous les c\u00f4t\u00e9s (haut, bas, gauche, droite) *\/\n  }\n}\n  .pacific-web-radios .popular-radios-section h2 {\n    color: #00ffff;\n    font-size: 24px;\n    margin-bottom: 10px;\n  }\n  .pacific-web-radios .popular-radios-section h3 {\n    color: #ffffff;\n    font-size: 18px;\n    margin-bottom: 20px;\n  }\n  .pacific-web-radios #popular-radios-list-france {\n    list-style-type: none;\n    padding: 0;\n  }\n  @media (max-width: 767px) {\n  .pacific-web-radios #popular-radios-list-france {\n    text-align: center; \/* Centre le contenu des cartes *\/\n    justify-content: center; \/* Centre tout contenu flex interne si n\u00e9cessaire *\/\n  }\n}\n  .pacific-web-radios #popular-radios-list-france li {\n    margin-bottom: 10px;\n    padding: 10px;\n    background-color: rgba(0, 255, 255, 0.1);\n    border-radius: 5px;\n    cursor: pointer;\n    transition: background-color 0.3s ease;\n  }\n  .pacific-web-radios #popular-radios-list-france li:hover {\n    background-color: rgba(0, 255, 255, 0.2);\n  }\n  \/* Loading Animation styles *\/\n  .loading-animation {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background-color: rgba(0, 0, 0, 0.7);\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    z-index: 9999;\n  }\n  .spinner {\n    width: 50px;\n    height: 50px;\n    border: 5px solid #00ffff;\n    border-top: 5px solid transparent;\n    border-radius: 50%;\n    animation: spin 1s linear infinite;\n  }\n  @keyframes spin {\n    0% { transform: rotate(0deg); }\n    100% { transform: rotate(360deg); }\n  }\n  .loading-animation p {\n    margin-top: 20px;\n    color: #00ffff;\n    font-size: 18px;\n  }\n  \/* Modal styles *\/\n  .pacific-web-radios .modal {\n    display: none;\n    position: fixed;\n    z-index: 1000;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    overflow: auto;\n    background-color: rgba(0,0,0,0.4);\n    backdrop-filter: blur(5px);\n  }\n  .pacific-web-radios .modal-content {\n    background-color: #2c2c2c;\n    padding: 30px;\n    border: 2px solid #00ffff;\n    width: 90%;\n    max-width: 500px;\n    max-height: 90vh;\n    border-radius: 20px;\n    text-align: center;\n    box-shadow: 0 0 30px rgba(0, 255, 255, 0.5);\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    overflow-y: auto;\n  }\n  .pacific-web-radios .modal-header {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    margin-bottom: 20px;\n  }\n  .pacific-web-radios #station-logo {\n    width: 150px;\n    height: 150px;\n    border-radius: 50%;\n    margin-bottom: 15px;\n    box-shadow: 0 0 20px rgba(0, 255, 255, 0.3);\n  }\n  .pacific-web-radios #station-name {\n    margin-bottom: 5px;\n    color: #00ffff;\n    font-size: 24px;\n  }\n  .pacific-web-radios #station-country {\n    margin-bottom: 10px;\n    color: #ffffff;\n    font-size: 16px;\n  }\n  .pacific-web-radios #station-description {\n    margin-bottom: 15px;\n    color: #cccccc;\n    font-size: 14px;\n  }\n  .pacific-web-radios #station-tags {\n    margin-bottom: 10px;\n  }\n  .pacific-web-radios .tag-vignette {\n    display: inline-block;\n    background-color: rgba(0, 255, 255, 0.2);\n    color: #00ffff;\n    padding: 5px 10px;\n    margin: 2px;\n    border-radius: 15px;\n    font-size: 12px;\n    cursor: pointer;\n  }\n  .pacific-web-radios #station-info {\n    display: flex;\n    justify-content: center;\n    gap: 15px;\n    margin-bottom: 20px;\n    color: #00ffff;\n    font-size: 14px;\n  }\n  .pacific-web-radios #audio-controls {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: 20px;\n  }\n  .pacific-web-radios .control-button {\n    width: 50px;\n    height: 50px;\n    background-color: #00ffff;\n    border: none;\n    border-radius: 50%;\n    cursor: pointer;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    transition: background-color 0.3s ease, transform 0.1s ease;\n  }\n  .pacific-web-radios .control-button:hover {\n    background-color: #00cccc;\n    transform: scale(1.1);\n  }\n  .pacific-web-radios .control-button img {\n    width: 25px;\n    height: 25px;\n    filter: invert(1);\n  }\n  .pacific-web-radios #volume-slider {\n    width: 120px;\n    accent-color: #00ffff;\n  }\n  .pacific-web-radios .close {\n    position: absolute;\n    top: 10px;\n    right: 20px;\n    color: #00ffff;\n    font-size: 35px;\n    font-weight: bold;\n    cursor: pointer;\n    transition: color 0.3s;\n  }\n  .pacific-web-radios .close:hover {\n    color: #00cccc;\n  }\n  \/* Select2 Styles *\/\n  .pacific-web-radios .select2-container {\n    min-width: 200px !important;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--single,\n  .pacific-web-radios .select2-container--default .select2-selection--multiple {\n    background-color: rgba(255, 255, 255, 0.1);\n    border: 2px solid #00ffff;\n    border-radius: 5px;\n    color: #ffffff;\n    padding: 10px;\n    font-size: 1em;\n    height: auto;\n    box-shadow: 0 0 10px #00ffff;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--single .select2-selection__rendered,\n  .pacific-web-radios .select2-container--default .select2-selection--multiple .select2-selection__rendered {\n    color: #ffffff;\n    line-height: normal;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--single .select2-selection__arrow {\n    height: 100%;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--multiple .select2-selection__choice {\n    background-color: #00ffff;\n    color: #000;\n    border: none;\n    padding: 5px 10px;\n    border-radius: 15px;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {\n    color: #000;\n    margin-right: 5px;\n  }\n  .pacific-web-radios .select2-container--default .select2-search--inline .select2-search__field {\n    color: #ffffff;\n  }\n  .pacific-web-radios .select2-dropdown {\n    background-color: #2c2c2c;\n    border: 2px solid #00ffff;\n  }\n  .pacific-web-radios .select2-container--default .select2-results__option--highlighted[aria-selected] {\n    background-color: #00ffff;\n    color: #000;\n  }\n  .pacific-web-radios .select2-container--default .select2-results__option[aria-selected=true] {\n    background-color: #008080;\n  }\n  .pacific-web-radios .select2-container--default .select2-selection--single::placeholder,\n  .pacific-web-radios .select2-container--default .select2-selection--multiple::placeholder,\n  .pacific-web-radios .select2-container--default .select2-selection--multiple .select2-search__field::placeholder {\n    color: #ffffff;\n  }\n  \/* Pagination styles *\/\n  .pacific-web-radios .pagination {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin-top: 20px;\n    margin-bottom: 50px;\n  }\n  .pacific-web-radios .round-button {\n    width: 40px;\n    height: 40px;\n    border-radius: 50%;\n    background-color: transparent;\n    border: 2px solid #00ffff;\n    color: #00ffff;\n    font-size: 16px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    cursor: pointer;\n    margin: 0 5px;\n    transition: all 0.3s ease;\n    box-shadow: 0 0 10px rgba(0, 255, 255, 0.3);\n  }\n  .pacific-web-radios .round-button:hover {\n    background-color: #00ffff;\n  }\n  .pacific-web-radios .round-button:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n  .pacific-web-radios #page-numbers {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  .pacific-web-radios .page-number {\n    width: 30px;\n    height: 30px;\n    border-radius: 50%;\n    background-color: transparent;\n    border: 2px solid #00ffff;\n    color: #00ffff;\n    font-size: 14px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    cursor: pointer;\n    margin: 0 3px;\n    transition: all 0.3s ease;\n  }\n  .pacific-web-radios .page-number.active {\n    background-color: #00ffff;\n    color: #000;\n  }\n  \/* Update the existing media queries for mobile *\/\n  @media (max-width: 600px) {\n    .pacific-web-radios .content-wrapper {\n      padding-left: 15px;\n      padding-right: 15px;\n      width: 100%;\n      box-sizing: border-box;\n    }\n    .pacific-web-radios .first-block-content,\n    .pacific-web-radios #results-container {\n      width: 100%;\n      padding-left: 15px;\n      padding-right: 15px;\n    }\n    .pacific-web-radios .station-card {\n      width: calc(100% - 30px);\n      margin-left: auto;\n      margin-right: auto;\n    }\n    .pacific-web-radios .search-and-filter-container {\n      flex-direction: column;\n      align-items: stretch;\n    }\n    .pacific-web-radios #search-container,\n    .pacific-web-radios #category-filter-container {\n      width: 100%;\n      margin: 5px 0;\n    }\n    .pacific-web-radios .select2-container {\n      width: 100% !important;\n    }\n  }\n  \/* Add a new media query for very small screens *\/\n  @media (max-width: 480px) {\n    .pacific-web-radios .content-wrapper {\n      padding-left: 10px;\n      padding-right: 10px;\n    }\n    .pacific-web-radios .first-block-content {\n      padding: 10px;\n    }\n    .pacific-web-radios .station-card {\n      width: calc(100% - 20px);\n      padding: 10px;\n    }\n  }\n  \/* Add this new CSS rule for the country flag *\/\n  .pacific-web-radios .country-flag {\n    width: 20px;\n    height: 15px;\n    object-fit: contain;\n    margin-right: 5px;\n    vertical-align: middle;\n  }\n  .pacific-web-radios .favorite-button img,\n  .pacific-web-radios .round-button img {\n    width: 20px;\n    height: 20px;\n    filter: invert(48%) sepia(94%) saturate(456%) hue-rotate(140deg) brightness(101%) contrast(101%);\n  }\n  .pacific-web-radios .favorite-button.active img {\n    filter: none;\n  }\n  .pacific-web-radios .round-button:disabled img {\n    opacity: 0.5;\n  }\n  .pacific-web-radios #chromecast-button {\n    background-color: #00ffff;\n    border: none;\n    border-radius: 50%;\n    cursor: pointer;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    transition: background-color 0.3s ease, transform 0.1s ease;\n    width: 50px;\n    height: 50px;\n  }\n  .pacific-web-radios #chromecast-button:hover {\n    background-color: #00cccc;\n    transform: scale(1.1);\n  }\n  .pacific-web-radios #chromecast-button img {\n    width: 25px;\n    height: 25px;\n    filter: invert(1);\n  }\n  @keyframes zoomInOut {\n    0%, 100% { transform: scale(1); }\n    50% { transform: scale(1.1); }\n  }\n  .background-slideshow .slide {\n    animation: zoomInOut 20s ease-in-out infinite;\n  }\n  .background-slideshow .slide:nth-child(2) {\n    animation-delay: -6.66s;\n  }\n  .background-slideshow .slide:nth-child(3) {\n    animation-delay: -13.33s;\n  }\n  .radio-presentation {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 2rem;\n    margin: 2rem 0;\n  }\n\n  .main-radio-logo {\n    width: 200px;\n    height: 200px;\n    border-radius: 50%;\n    box-shadow: 0 0 30px rgba(0, 255, 255, 0.5);\n  }\n\n  .play-button-large {\n    display: flex;\n    align-items: center;\n    gap: 1rem;\n    padding: 1rem 2rem;\n    font-size: 1.2rem;\n    background-color: #00ffff;\n    border: none;\n    border-radius: 50px;\n    color: #000;\n    cursor: pointer;\n    transition: all 0.3s ease;\n  }\n\n  .play-button-large:hover {\n    background-color: #00cccc;\n    transform: scale(1.05);\n  }\n\n  .play-button-large img {\n    width: 24px;\n    height: 24px;\n    filter: invert(1);\n  }\n\n  .radio-history, .popular-shows {\n    margin: 4rem 0;\n    padding: 2rem;\n    background-color: rgba(0, 255, 255, 0.1);\n    border-radius: 10px;\n    box-shadow: 0 0 20px rgba(0, 255, 255, 0.2);\n  }\n\n  .shows-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n    gap: 2rem;\n    margin-top: 2rem;\n  }\n\n  .show-card {\n    padding: 1.5rem;\n    background-color: rgba(0, 0, 0, 0.3);\n    border: 1px solid #00ffff;\n    border-radius: 10px;\n    transition: all 0.3s ease;\n  }\n\n  .show-card:hover {\n    transform: translateY(-5px);\n    box-shadow: 0 5px 15px rgba(0, 255, 255, 0.3);\n  }\n\n  .show-card h3 {\n    color: #00ffff;\n    margin-bottom: 0.5rem;\n  }\n\n  .show-card p {\n    color: #ffffff;\n    margin: 0.5rem 0;\n  }\n<\/style>\n<script src=\"https:\/\/www.gstatic.com\/cv\/js\/sender\/v1\/cast_sender.js?loadCastFramework=1\"><\/script>\n<\/head>\n<body>\n  <div class=\"pacific-web-radios\">\n    <div id=\"player-modal\" class=\"modal\">\n      <div class=\"modal-content\">\n  <span class=\"close\">\u00d7<\/span>\n  <div class=\"modal-header\">\n    <img decoding=\"async\" id=\"station-logo\" src=\"\" alt=\"Logo de la station\" class=\"station-logo\">\n    <h2 id=\"station-name\"><\/h2>\n    <p id=\"station-country\"><\/p>\n  <\/div>\n  <div id=\"station-info\">\n    <span id=\"station-tags\"><\/span>\n  <\/div>\n  <div id=\"audio-controls\">\n    <button id=\"play-pause\" class=\"control-button\">\n      <img decoding=\"async\" src=\"https:\/\/pacific-webtools.com\/radio-online\/wp-content\/uploads\/2024\/10\/logo-16.webp\" alt=\"Ic\u00f4ne de lecture\">\n    <\/button>\n    <input type=\"range\" id=\"volume-slider\" min=\"0\" max=\"1\" step=\"0.1\" value=\"1\">\n    <button id=\"chromecast-button\" class=\"control-button\">\n      <img decoding=\"async\" src=\"https:\/\/pacific-webtools.com\/radio-online\/wp-content\/uploads\/2024\/10\/logo-20.webp\" alt=\"Ic\u00f4ne Chromecast\" style=\"width: 16px; height: 16px;\">\n    <\/button>\n        <\/div>\n      <\/div>\n    <\/div>\n    <div class=\"first-block\">\n  <div class=\"background-slideshow\">\n    <div class=\"slide active\" style=\"background-image: url('https:\/\/www.sudradio.fr\/wp-content\/uploads\/2024\/04\/Andre-Bercoff-1.jpg');\"><\/div>\n    <div class=\"slide\" style=\"background-image: url('https:\/\/www.sudradio.fr\/wp-content\/uploads\/2024\/10\/Bourdin.jpg');\"><\/div>\n    <div class=\"slide\" style=\"background-image: url('https:\/\/pbs.twimg.com\/media\/F1jEXhpWAAETADy.jpg');\"><\/div>\n  <\/div>\n  <div class=\"content-wrapper\" style=\"@media (max-width: 767px) { padding-left: 15px; padding-right: 15px; }\">\n    <div class=\"first-block-content\">\n      <h1>\u00c9couter Sud Radio en direct gratuitement<\/h1>\n      <div class=\"radio-presentation\">\n  <img decoding=\"async\" src=\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/10\/sud-radio-en-ligne.webp\" alt=\"Logo Sud Radio\" class=\"main-radio-logo\">\n\n        <div class=\"buttons-container\" style=\"display: flex; justify-content: center; flex-wrap: wrap; gap: 20px;\">\n      <button id=\"listen-live\" class=\"play-button-large\" style=\"animation: vibrate 1s infinite;\">\n        <img decoding=\"async\" src=\"https:\/\/pacific-webtools.com\/radio-online\/wp-content\/uploads\/2024\/10\/logo-16.webp\" alt=\"\u00c9couter en direct\">\n        \u00c9couter en direct\n      <\/button>\n\n      <a href=\"https:\/\/radiostreamr.com\/radio-france\/category\/podcast\/sud-radio\/\" class=\"play-button-large\" style=\"text-decoration: none; display: flex; align-items: center; gap: 1rem;\">\n        <img decoding=\"async\" src=\"https:\/\/cdn-icons-png.flaticon.com\/512\/665\/665152.png\" alt=\"\u00c9coutez les podcasts\" style=\"width: 24px; height: 24px; filter: none;\">\n        \u00c9coutez les podcasts\n      <\/a>\n    <\/div>\n  \n  <div class=\"social-share-buttons\" style=\"display: flex; gap: 15px; margin: 20px 0;\">\n    <!-- X (Twitter) -->\n    <a href=\"#\" onclick=\"shareOnPlatform('twitter')\" class=\"social-button\" style=\"background: #000; border-radius: 50%; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease;\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"#ffffff\">\n        <path d=\"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z\"><\/path>\n      <\/svg>\n    <\/a>\n\n    <!-- WhatsApp -->\n    <a href=\"#\" onclick=\"shareOnPlatform('whatsapp')\" class=\"social-button\" style=\"background: #25D366; border-radius: 50%; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease;\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"#ffffff\">\n        <path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.297-.347.446-.52.151-.174.2-.298.3-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z\"><\/path>\n      <\/svg>\n    <\/a>\n\n    <!-- Facebook -->\n    <a href=\"#\" onclick=\"shareOnPlatform('facebook')\" class=\"social-button\" style=\"background: #1877F2; border-radius: 50%; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease;\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"#ffffff\">\n        <path d=\"M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z\"><\/path>\n      <\/svg>\n    <\/a>\n\n    <!-- LinkedIn -->\n    <a href=\"#\" onclick=\"shareOnPlatform('linkedin')\" class=\"social-button\" style=\"background: #0A66C2; border-radius: 50%; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease;\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"#ffffff\">\n        <path d=\"M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z\"><\/path>\n      <\/svg>\n    <\/a>\n  <\/div>\n\n  <script>\n    function shareOnPlatform(platform) {\n      const currentUrl = window.location.href;\n      const text = \"\u00c9coutez Sud Radio en direct sur\";\n      \n      let shareUrl = '';\n      \n      switch(platform) {\n        case 'twitter':\n          shareUrl = `https:\/\/twitter.com\/intent\/tweet?url=${encodeURIComponent(currentUrl)}&text=${encodeURIComponent(text)}`;\n          break;\n        case 'whatsapp':\n          shareUrl = `https:\/\/wa.me\/?text=${encodeURIComponent(text + ' ' + currentUrl)}`;\n          break;\n        case 'facebook':\n          shareUrl = `https:\/\/www.facebook.com\/sharer\/sharer.php?u=${encodeURIComponent(currentUrl)}`;\n          break;\n        case 'linkedin':\n          shareUrl = `https:\/\/www.linkedin.com\/sharing\/share-offsite\/?url=${encodeURIComponent(currentUrl)}`;\n          break;\n      }\n      \n      window.open(shareUrl, '_blank', 'width=600,height=400');\n    }\n\n    \/\/ Add hover effects for social buttons\n    document.querySelectorAll('.social-button').forEach(button => {\n      button.addEventListener('mouseover', function() {\n        this.style.transform = 'scale(1.1)';\n      });\n      button.addEventListener('mouseout', function() {\n        this.style.transform = 'scale(1)';\n      });\n    });\n  <\/script>\n<\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n    <div class=\"content-wrapper\">\n      <section class=\"radio-history\" style=\"text-align: center; padding: 40px; margin: 40px 0; background: rgba(0, 255, 255, 0.05); border-radius: 15px; box-shadow: 0 0 30px rgba(0, 255, 255, 0.1);\">\n  <div class=\"radio-stats\" style=\"display: flex; justify-content: center; gap: 30px; margin-bottom: 40px; flex-wrap: wrap;\">\n    <!-- Encadr\u00e9 Date de cr\u00e9ation -->\n    <div class=\"stat-box\" style=\"background: linear-gradient(135deg, rgba(0,255,255,0.1) 0%, rgba(0,255,255,0.2) 100%); padding: 20px 40px; border-radius: 15px; border: 2px solid rgba(0,255,255,0.3); min-width: 200px;\">\n      <div style=\"font-size: 0.9em; color: #00ffff; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 2px;\">Date de cr\u00e9ation<\/div>\n      <div style=\"font-size: 2em; font-weight: bold; color: #ffffff; text-shadow: 0 0 10px rgba(0,255,255,0.5);\">1958<\/div>\n    <\/div>\n    \n    <!-- Encadr\u00e9 Fr\u00e9quence FM -->\n    <div class=\"stat-box\" style=\"background: linear-gradient(135deg, rgba(0,255,255,0.1) 0%, rgba(0,255,255,0.2) 100%); padding: 20px 40px; border-radius: 15px; border: 2px solid rgba(0,255,255,0.3); min-width: 200px;\">\n      <div style=\"font-size: 0.9em; color: #00ffff; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 2px;\">Fr\u00e9quence FM<\/div>\n      <div style=\"font-size: 2em; font-weight: bold; color: #ffffff; text-shadow: 0 0 10px rgba(0,255,255,0.5);\">99.9 MHz<\/div>\n    <\/div>\n  <\/div>\n\n  <h2 style=\"color: #00ffff; font-size: 2em; margin-bottom: 30px; text-shadow: 0 0 15px rgba(0,255,255,0.3);\">Histoire de Sud Radio<\/h2>\n  \n  <div class=\"timeline\" style=\"max-width: 800px; margin: 0 auto; text-align: left; padding: 20px;\">\n    <div class=\"timeline-item\" style=\"margin-bottom: 30px; position: relative; padding-left: 30px; border-left: 2px solid #00ffff;\">\n      <h3 style=\"color: #00ffff; margin-bottom: 10px;\">Les d\u00e9buts en Andorre<\/h3>\n      <p style=\"color: #ffffff; line-height: 1.6;\">Sud Radio, fond\u00e9e initialement en Andorre, est une radio g\u00e9n\u00e9raliste fran\u00e7aise qui a marqu\u00e9 l'histoire de la radiodiffusion. D'abord connue sous le nom de Radio Andorre, elle s'est rapidement impos\u00e9e comme une voix majeure du Sud de la France avant de devenir une radio nationale.<\/p>\n    <\/div>\n\n    <div class=\"timeline-item\" style=\"margin-bottom: 30px; position: relative; padding-left: 30px; border-left: 2px solid #00ffff;\">\n      <h3 style=\"color: #00ffff; margin-bottom: 10px;\">\u00c9volution et croissance<\/h3>\n      <p style=\"color: #ffffff; line-height: 1.6;\">Au fil des d\u00e9cennies, Sud Radio a su \u00e9voluer tout en conservant son identit\u00e9 unique. La station a travers\u00e9 diff\u00e9rentes \u00e9poques marquantes :<\/p>\n      <ul style=\"list-style-type: none; padding-left: 0; margin-top: 15px;\">\n        <div style=\"background: rgba(0,255,255,0.1); margin: 10px 0; padding: 15px; border-radius: 10px;\">\n          <li style=\"color: #ffffff; margin-bottom: 10px;\">\ud83d\udcfb 1958-1968 : P\u00e9riode andorrane initiale, diffusion dans le Sud<\/li>\n        <\/div>\n        <div style=\"background: rgba(0,255,255,0.1); margin: 10px 0; padding: 15px; border-radius: 10px;\">\n          <li style=\"color: #ffffff; margin-bottom: 10px;\">\ud83d\udcfb 1970-1980 : Expansion de la couverture radiophonique<\/li>\n        <\/div>\n        <div style=\"background: rgba(0,255,255,0.1); margin: 10px 0; padding: 15px; border-radius: 10px;\">\n          <li style=\"color: #ffffff; margin-bottom: 10px;\">\ud83d\udcfb 1981-2000 : Adaptation \u00e0 la lib\u00e9ralisation des ondes<\/li>\n        <\/div>\n        <div style=\"background: rgba(0,255,255,0.1); margin: 10px 0; padding: 15px; border-radius: 10px;\">\n          <li style=\"color: #ffffff;\">\ud83d\udcfb 2001-pr\u00e9sent : Transformation en radio nationale<\/li>\n        <\/div>\n      <\/ul>\n    <\/div>\n\n    <div class=\"timeline-item\" style=\"margin-bottom: 30px; position: relative; padding-left: 30px; border-left: 2px solid #00ffff;\">\n      <h3 style=\"color: #00ffff; margin-bottom: 10px;\">Sud Radio aujourd'hui<\/h3>\n      <p style=\"color: #ffffff; line-height: 1.6;\">Bas\u00e9e \u00e0 Paris, Sud Radio continue de se distinguer par sa ligne \u00e9ditoriale ind\u00e9pendante et son engagement pour la libre expression. La station maintient un lien fort avec ses auditeurs historiques du Sud de la France tout en touchant un public national, proposant des d\u00e9bats, des analyses et des \u00e9missions d'information qui refl\u00e8tent la diversit\u00e9 des opinions.<\/p>\n    <\/div>\n  <\/div>\n<\/section>\n\n      <section class=\"popular-shows\">\n  <h2 style=\"text-align: center;\">\u00c9missions Phares<\/h2>\n  <div class=\"shows-grid\">\n    <div class=\"show-card\" style=\"text-align: center; cursor: pointer; position: relative;\" onclick=\"window.location.href='https:\/\/radiostreamr.com\/radio-france\/podcast-bercoff\/'\">\n      <div style=\"text-align: center;\">\n        <img decoding=\"async\" src=\"https:\/\/www.sudradio.fr\/wp-content\/uploads\/2024\/04\/Andre-Bercoff-1.jpg\" alt=\"Le Grand Matin Sud Radio\" style=\"width: 120px; height: 120px; border-radius: 50%; margin-bottom: 15px; object-fit: cover; border: 3px solid #00ffff; box-shadow: 0 0 15px rgba(0, 255, 255, 0.3); display: inline-block;\">\n      <\/div>\n      <h3 style=\"text-align: center;\">Berkoff dans tous ses \u00e9tats<\/h3>\n      <p style=\"text-align: center;\"><strong>Emission diffus\u00e9e du lundi au jeudi, 12h-14h<\/strong><\/p>\n      <p style=\"text-align: center;\">\"Bercoff dans tous ses \u00e9tats\" est une \u00e9mission diffus\u00e9e sur SUD RADIO, du lundi au jeudi, de 12h \u00e0 14h. Andr\u00e9 Bercoff y analyse et commente scrupuleusement l'actualit\u00e9 du jour, avec ses invit\u00e9s et l'\u0153il avis\u00e9 des auditeurs. Ainsi, l'\u00e9mission propose une discussion franche sur des sujets importants, tout en int\u00e9grant les r\u00e9actions du public. Gr\u00e2ce au style direct de Bercoff, les d\u00e9bats sont riches et captivants. Retrouvez \"Bercoff dans tous ses \u00e9tats\" en direct ou en podcast pour ne rien manquer de l'actualit\u00e9.<\/p>\n      <div style=\"position: absolute; top: 10px; right: 10px; background-color: #00ffff; color: black; padding: 5px 10px; border-radius: 15px; font-size: 0.8em; display: flex; align-items: center; gap: 5px; transition: transform 0.3s ease;\">\n        <svg class=\"podcast-icon\" style=\"width: 16px; height: 16px; transition: transform 0.3s ease;\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n          <path d=\"M12 0C8.69 0 6 2.69 6 6v6c0 3.31 2.69 6 6 6s6-2.69 6-6V6c0-3.31-2.69-6-6-6zm-2 20.8c-1.96-.64-3.58-2.01-4.48-3.8H4c-1.1 0-2 .9-2 2v0.2c0 2.21 1.79 4 4 4h4.8c-.51-.88-.8-1.89-.8-3v-.4zm12 0v0.2c0 2.21-1.79 4-4 4h-4.8c.51-.88.8-1.89.8-3v-.4h1.52c.9-1.79 2.52-3.16 4.48-3.8v3z\"><\/path>\n        <\/svg>\n        \u00c9coutez les podcasts\n      <\/div>\n    <\/div>\n    <div class=\"show-card\" style=\"text-align: center; cursor: pointer; position: relative;\" onclick=\"window.location.href='https:\/\/radiostreamr.com\/radio-france\/podcast-le-grand-matin-bourdin\/'\">\n      <div style=\"text-align: center;\">\n        <img decoding=\"async\" src=\"https:\/\/www.sudradio.fr\/wp-content\/uploads\/2024\/10\/Bourdin.jpg\" alt=\"On Va Se Dire Les Choses\" style=\"width: 120px; height: 120px; border-radius: 50%; margin-bottom: 15px; object-fit: cover; border: 3px solid #00ffff; box-shadow: 0 0 15px rgba(0, 255, 255, 0.3); display: inline-block;\">\n      <\/div>\n      <h3 style=\"text-align: center;\">Parlons Vrai chez Bourdin<\/h3>\n      <p style=\"text-align: center;\"><strong>Emission diffus\u00e9e du lundi au vendredi, 9h-10h<\/strong><\/p>\n      <p style=\"text-align: center;\">\"Parlons Vrai chez Bourdin\" est une \u00e9mission quotidienne diffus\u00e9e sur SUD RADIO, du lundi au vendredi, de 9h \u00e0 10h. Jean-Jacques Bourdin commente et d\u00e9bat de l'actualit\u00e9 du jour, avec ses invit\u00e9s. Ainsi, l'\u00e9mission permet de d\u00e9crypter les enjeux actuels, tout en donnant la parole aux intervenants. Gr\u00e2ce au franc-parler de Bourdin, les d\u00e9bats sont sans concession. Retrouvez \"Parlons Vrai chez Bourdin chaque jour, ou en podcast, pour une analyse sinc\u00e8re et percutante de l'actualit\u00e9.<\/p>\n      <div style=\"position: absolute; top: 10px; right: 10px; background-color: #00ffff; color: black; padding: 5px 10px; border-radius: 15px; font-size: 0.8em; display: flex; align-items: center; gap: 5px; transition: transform 0.3s ease;\">\n        <svg class=\"podcast-icon\" style=\"width: 16px; height: 16px; transition: transform 0.3s ease;\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n          <path d=\"M12 0C8.69 0 6 2.69 6 6v6c0 3.31 2.69 6 6 6s6-2.69 6-6V6c0-3.31-2.69-6-6-6zm-2 20.8c-1.96-.64-3.58-2.01-4.48-3.8H4c-1.1 0-2 .9-2 2v0.2c0 2.21 1.79 4 4 4h4.8c-.51-.88-.8-1.89-.8-3v-.4zm12 0v0.2c0 2.21-1.79 4-4 4h-4.8c.51-.88.8-1.89.8-3v-.4h1.52c.9-1.79 2.52-3.16 4.48-3.8v3z\"><\/path>\n        <\/svg>\n        \u00c9coutez les podcasts\n      <\/div>\n    <\/div>\n    <div class=\"show-card\" style=\"text-align: center; cursor: pointer; position: relative;\" onclick=\"window.location.href='https:\/\/radiostreamr.com\/radio-france\/podcast-poulain-sans-reserve\/'\">\n      <div style=\"text-align: center;\">\n        <img decoding=\"async\" src=\"https:\/\/pbs.twimg.com\/media\/F1jEXhpWAAETADy.jpg\" alt=\"100% News\" style=\"width: 120px; height: 120px; border-radius: 50%; margin-bottom: 15px; object-fit: cover; border: 3px solid #00ffff; box-shadow: 0 0 15px rgba(0, 255, 255, 0.3); display: inline-block;\">\n      <\/div>\n      <h3 style=\"text-align: center;\">Poulin sans r\u00e9serve<\/h3>\n      <p style=\"text-align: center;\"><strong>Emission diffus\u00e9e le Vendredi, 12h-14h<\/strong><\/p>\n      <p class=\"radio-description\" style=\"text-align: center;\">\"Alexis Poulin sans r\u00e9serve\" est une \u00e9mission diffus\u00e9e chaque vendredi de 12h \u00e0 13h sur SUD RADIO. Anim\u00e9e par Alexis Poulin, elle analyse l'actualit\u00e9 de la semaine de mani\u00e8re critique, accompagn\u00e9e d'invit\u00e9s vari\u00e9s. Les d\u00e9bats sont francs et engag\u00e9s, abordant des sujets nationaux et internationaux avec une grande transparence. Retrouvez l'\u00e9mission en podcast pour \u00e9couter les \u00e9changes anim\u00e9s et enrichissants d'Alexis Poulin et de ses invit\u00e9s, et d\u00e9couvrez une autre perspective sur les faits marquants de l'actualit\u00e9.<\/p>\n      <div style=\"position: absolute; top: 10px; right: 10px; background-color: #00ffff; color: black; padding: 5px 10px; border-radius: 15px; font-size: 0.8em; display: flex; align-items: center; gap: 5px; transition: transform 0.3s ease;\">\n        <svg class=\"podcast-icon\" style=\"width: 16px; height: 16px; transition: transform 0.3s ease;\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n          <path d=\"M12 0C8.69 0 6 2.69 6 6v6c0 3.31 2.69 6 6 6s6-2.69 6-6V6c0-3.31-2.69-6-6-6zm-2 20.8c-1.96-.64-3.58-2.01-4.48-3.8H4c-1.1 0-2 .9-2 2v0.2c0 2.21 1.79 4 4 4h4.8c-.51-.88-.8-1.89-.8-3v-.4zm12 0v0.2c0 2.21-1.79 4-4 4h-4.8c.51-.88.8-1.89.8-3v-.4h1.52c.9-1.79 2.52-3.16 4.48-3.8v3z\"><\/path>\n        <\/svg>\n        \u00c9coutez les podcasts\n      <\/div>\n    <\/div>\n  <\/div>\n  <style>\n    .show-card:hover .podcast-icon {\n      transform: rotate(360deg);\n    }\n    .show-card:hover div[style*=\"position: absolute\"] {\n      transform: scale(1.1);\n    }\n  <\/style>\n<\/section>\n\n<section class=\"presenter-profile\" style=\"padding: 40px 0; background-color: rgba(0, 255, 255, 0.1); margin-top: 40px; border-radius: 10px;\">\n  <h2 style=\"text-align: center; color: #00ffff; margin-bottom: 30px;\">Andr\u00e9 Bercoff : La voix embl\u00e9matique de Sud Radio<\/h2>\n  <div style=\"display: flex; gap: 30px; padding: 0 20px; flex-wrap: wrap; justify-content: center; align-items: center;\">\n    <img decoding=\"async\" src=\"https:\/\/www.sudradio.fr\/wp-content\/uploads\/2024\/04\/Andre-Bercoff-1.jpg\" alt=\"Andr\u00e9 Bercoff Portrait\" style=\"width: 200px; height: 200px; border-radius: 50%; object-fit: cover; border: 3px solid #00ffff; box-shadow: 0 0 20px rgba(0, 255, 255, 0.3);\">\n    <div style=\"flex: 1; min-width: 300px; max-width: 600px;\">\n      <p style=\"color: #ffffff; line-height: 1.6; text-align: justify;\">\n        Andr\u00e9 Bercoff, n\u00e9 le 28 juillet 1940 \u00e0 Beyrouth, est un journaliste, \u00e9crivain et animateur radio fran\u00e7ais de renom. Dipl\u00f4m\u00e9 de Sciences Po Paris et docteur en droit, il d\u00e9bute sa carri\u00e8re dans le journalisme dans les ann\u00e9es 1970. Au fil des d\u00e9cennies, il s'impose comme une figure incontournable du paysage m\u00e9diatique fran\u00e7ais, multipliant les collaborations avec diff\u00e9rents m\u00e9dias. Sur Sud Radio, il anime depuis plusieurs ann\u00e9es l'\u00e9mission \"Bercoff dans tous ses \u00e9tats\", o\u00f9 il aborde l'actualit\u00e9 avec un style direct et sans concession qui lui est propre. Auteur prolifique, il a publi\u00e9 plus de quarante ouvrages, dont plusieurs essais politiques et romans. Son approche franche des sujets d'actualit\u00e9 et sa capacit\u00e9 \u00e0 susciter le d\u00e9bat en font l'une des voix les plus \u00e9cout\u00e9es de la radio fran\u00e7aise.\n      <\/p>\n    <\/div>\n  <\/div>\n<\/section>\n    <\/div>\n\n    <div id=\"loading-animation\" class=\"loading-animation\" style=\"display: none;\">\n      <div class=\"spinner\"><\/div>\n      <p>Chargement des stations de radio...<\/p>\n    <\/div>\n    \n    <div class=\"popular-radios-section\" style=\" box-sizing: border-box;\">\n      <h2 style=\"text-align: center;\">Stations de radio similaires en France<\/h2>\n      <h3 style=\"text-align: center; display: flex; justify-content: center; align-items: center;\">\n        Ecoutez d'autres radios d'actualit\u00e9s\n      <\/h3>\n      <ul id=\"popular-radios-list-france\" style=\"list-style-type: none; padding: 0;\">\n        <li style=\"margin-bottom: 10px; padding: 10px; background-color: rgba(0, 255, 255, 0.1); border-radius: 5px; cursor: pointer; transition: background-color 0.3s ease;\">\n          <img decoding=\"async\" src=\"path-to-logo.png\" alt=\"Radio Logo\" style=\"width: 65px; height: 65px; margin-right: 10px; border-radius: 50%; vertical-align: middle; box-shadow: 0 0 15px #00ffff;\">\n          <span style=\"text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff; font-size: 1.5em;\">Nom de la radio<\/span>\n          <p class=\"radio-description\" style=\"margin-top: 5px; color: #cccccc;\">Description de la radio<\/p>\n        <\/li>\n      <\/ul>\n      <style>\n        #popular-radios-list-france li img {\n          width: 65px !important;\n          height: 65px !important;\n        }\n        #popular-radios-list-france li span {\n          text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff;\n          font-weight: 500;\n          font-size: 1.5em;\n        }\n      <\/style>\n      <script>\n        function fetchPopularRadios() {\n          const popularRadiosFrance = [\n            { \n              name: \"France Inter\", \n              url: \"https:\/\/icecast.radiofrance.fr\/franceinter-midfi.mp3\",\n              description: \"France Inter est une radio g\u00e9n\u00e9raliste nationale, reconnue pour sa programmation diversifi\u00e9e et sa rigueur \u00e9ditoriale. La station offre des \u00e9missions couvrant l'actualit\u00e9, la culture, la politique, et l'humour, le tout avec une qualit\u00e9 remarquable. France Inter se distingue par ses matinales riches en informations et ses d\u00e9bats stimulants, permettant une couverture compl\u00e8te de l'actualit\u00e9 du jour. En plus des analyses s\u00e9rieuses, la station propose des chroniques culturelles et des \u00e9missions humoristiques, rendant l'info accessible. \u00c9coutez France Inter en direct, en ligne ou via podcast, pour une information de qualit\u00e9 et des contenus culturels vari\u00e9s.\",\n              favicon: \"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/10\/france-inter-logo.webp\"\n            },\n            { \n              name: \"RTL\", \n              url: \"https:\/\/icecast.rtl.fr\/rtl-1-44-128\",\n              description: \"RTL est une radio g\u00e9n\u00e9raliste fran\u00e7aise offrant une programmation riche et vari\u00e9e, alliant information, divertissement, culture, et sport. Connue pour ses matinales dynamiques, RTL informe ses auditeurs sur l'actualit\u00e9 nationale et internationale avec rigueur et pr\u00e9cision. Les d\u00e9bats et interviews rythment la journ\u00e9e, offrant des analyses pointues sur les sujets d'actualit\u00e9. En plus des informations, RTL propose des chroniques de soci\u00e9t\u00e9, des \u00e9missions de divertissement et des jeux qui captivent un public large. Gr\u00e2ce \u00e0 des animateurs embl\u00e9matiques et une couverture compl\u00e8te des \u00e9v\u00e9nements, RTL s'impose comme une r\u00e9f\u00e9rence incontournable de la radio en France. Retrouvez RTL en direct, en ligne ou en podcast.\",\n              favicon: \"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/10\/logo-rtl-radio-en-ligne.webp\"\n            },\n            { \n              name: \"RMC\", \n              url: \"https:\/\/audio.bfmtv.com\/rmcradio_128.mp3\",\n              description: \"RMC est une radio g\u00e9n\u00e9raliste fran\u00e7aise qui se distingue par son ton direct et sa programmation orient\u00e9e vers l'actualit\u00e9, le sport, et les d\u00e9bats. Connue pour ses \u00e9missions interactives, RMC met l'accent sur les discussions sans filtre, permettant aux auditeurs de participer activement aux d\u00e9bats d'actualit\u00e9. En tant que radio d'information, RMC couvre les sujets nationaux et internationaux avec une approche analytique et percutante. Les \u00e9missions sportives sont aussi une marque de fabrique de RMC, avec des analyses en direct et des talk-shows qui attirent les passionn\u00e9s de sport. Retrouvez RMC en direct, en ligne ou en podcast pour des analyses franches et des d\u00e9bats engag\u00e9s.\",\n              favicon: \"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/10\/rmc-logo.webp\"\n            },\n            { \n              name: \"Europe 1\", \n              url: \"https:\/\/stream.europe1.fr\/europe1.mp3\",\n              description: \"Europe 1 est une radio g\u00e9n\u00e9raliste fran\u00e7aise r\u00e9put\u00e9e pour ses \u00e9missions d'actualit\u00e9, de culture et de divertissement. Avec une approche dynamique, Europe 1 propose des matinales riches en informations, des interviews exclusives, et des d\u00e9bats anim\u00e9s qui d\u00e9cryptent l'actualit\u00e9 nationale et internationale. La station se distingue par la qualit\u00e9 de ses animateurs et chroniqueurs, qui apportent un regard expert et accessible sur les sujets du moment. En plus de l'information, Europe 1 offre des contenus vari\u00e9s allant de la culture au divertissement, afin de toucher un large public. Retrouvez Europe 1 en direct, en ligne ou en podcast pour rester inform\u00e9 et diverti.\",\n              favicon: \"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/10\/logo-europe1.webp\"\n            }\n          ];\n\n          const popularRadiosListFrance = document.getElementById('popular-radios-list-france');\n          popularRadiosListFrance.innerHTML = '';\n\n          popularRadiosFrance.forEach((station, index) => {\n            const li = document.createElement('li');\n            li.innerHTML = `\n              <img decoding=\"async\" src=\"${station.favicon}\" alt=\"${station.name} logo\" style=\"width: 65px; height: 65px; margin-right: 10px; border-radius: 50%; vertical-align: middle;\">\n              <span style=\"font-size: 1.5em;\">${station.name}<\/span>\n              <p class=\"radio-description\">${station.description}<\/p>\n            `;\n\n            li.addEventListener('click', () => {\n              let stationToPlay = {\n                url_resolved: station.url,\n                name: station.name,\n                favicon: station.favicon || null,\n                description: station.description,\n              };\n\n              const detailedStation = allStations.find(s => s.name.toLowerCase() === station.name.toLowerCase());\n              \n              if (detailedStation) {\n                stationToPlay.favicon = stationToPlay.favicon || detailedStation.favicon;\n                stationToPlay.tags = detailedStation.tags || '';\n              }\n\n              playStation(stationToPlay);\n            });\n\n            popularRadiosListFrance.appendChild(li);\n          });\n        }\n      <\/script>\n    <\/div>\n  <\/div>\n\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/axios\/0.21.1\/axios.min.js\"><\/script>\n<script src=\"https:\/\/code.jquery.com\/jquery-3.6.0.min.js\"><\/script>\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/select2@4.1.0-rc.0\/dist\/js\/select2.min.js\"><\/script>\n<script>\nlet favorites = JSON.parse(localStorage.getItem('favorites')) || [];\nlet history = JSON.parse(localStorage.getItem('history')) || [];\nlet currentTab = 'all';\n\nconst searchInput = document.getElementById('search-input');\nconst searchButton = document.getElementById('search-button');\nconst resultsContainer = document.getElementById('results-container');\nconst playerModal = document.getElementById('player-modal');\nconst paginationContainer = document.getElementById('pagination-container');\nconst prevButton = document.getElementById('prev-button');\nconst nextButton = document.getElementById('next-button');\nconst audioElement = new Audio();\nlet currentStation = null;\nlet currentPage = 1;\nlet stationsPerPage = 20;\nlet totalPages = 0;\nconst pageNumbersContainer = document.getElementById('page-numbers');\nconst playPauseButton = document.getElementById('play-pause');\nconst volumeSlider = document.getElementById('volume-slider');\nconst muteUnmuteButton = document.getElementById('mute-unmute');\nconst closeModalButton = document.querySelector('.close');\nconst chromecastButton = document.getElementById('chromecast-button');\n\ndocument.getElementById('listen-live').addEventListener('click', function() {\n  const sudRadioStation = {\n    name: \"Sud Radio\",\n    url_resolved: \"https:\/\/start-sud.ice.infomaniak.ch\/start-sud-high.mp3\",\n    favicon: \"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/10\/sud-radio-en-ligne.webp\",\n    description: \"Sud Radio, fond\u00e9e en 1958 \u00e0 Andorre, est une radio g\u00e9n\u00e9raliste fran\u00e7aise historique.\",\n    tags: \"News,Talk,Information\",\n    bitrate: \"128\"\n  };\n  playStation(sudRadioStation);\n});\n\nfunction showLoadingAnimation() {\n  document.getElementById('loading-animation').style.display = 'flex';\n}\n\nfunction hideLoadingAnimation() {\n  document.getElementById('loading-animation').style.display = 'none';\n}\n\nfunction playStation(station) {\n  if (!station) return;\n\n  if (!station.url_resolved) {\n    station.url_resolved = `https:\/\/example.com\/stream\/${station.name.replace(\/\\s+\/g, '-').toLowerCase()}`;\n  }\n\n  audioElement.src = station.url_resolved;\n  audioElement.play().catch(error => console.error('Error playing audio:', error));\n  currentStation = station;\n  updateModalUI();\n  openModal();\n  addToHistory(station);\n}\n\nfunction handleTagClick(event) {\n  if (event.target.classList.contains('tag-vignette')) {\n    const tag = event.target.textContent.trim();\n    closeModal();\n    addCategoryToSelect(tag);\n    performSearch(tag);\n  }\n}\n\nfunction addCategoryToSelect(category) {\n  if (!$('#category-select').find(\"option[value='\" + category + \"']\").length) {\n    var newOption = new Option(category, category, true, true);\n    $('#category-select').append(newOption).trigger('change');\n  }\n}\n\nfunction extractCategories(stations) {\n  const categories = {};\n  stations.forEach(station => {\n    if (station.tags) {\n      station.tags.split(',').forEach(tag => {\n        const trimmedTag = tag.trim();\n        if (trimmedTag.length <= 20) {\n          categories[trimmedTag] = (categories[trimmedTag] || 0) + 1;\n        }\n      });\n    }\n  });\n  return Object.entries(categories)\n    .sort((a, b) => b[1] - a[1])\n    .slice(0, 10)\n    .map(([category]) => category);\n}\n\nfunction renderCategoryVignettes(categories) {\n  return `\n    <div class=\"category-vignettes\">\n      ${categories.map(category => `\n        <span class=\"tag-vignette\" onclick=\"performSearch('${category}')\">${category}<\/span>\n      `).join('')}\n    <\/div>\n  `;\n}\n\nfunction updateModalUI() {\n  if (!currentStation) return;\n\n  const stationLogo = document.getElementById('station-logo');\n  const stationName = document.getElementById('station-name');\n  const stationCountry = document.getElementById('station-country');\n  const stationDescription = document.getElementById('station-description');\n  const stationTags = document.getElementById('station-tags');\n  const stationBitrate = document.getElementById('station-bitrate');\n\n  if (stationLogo) stationLogo.src = currentStation.favicon || 'https:\/\/pacific-webtools.com\/radio-online\/wp-content\/uploads\/2024\/10\/logo-15.webp';\n  if (stationName) stationName.textContent = currentStation.name || 'Station inconnue';\n  if (stationCountry) stationCountry.textContent = 'France';\n  if (stationDescription) stationDescription.textContent = currentStation.homepage || 'Aucune description disponible';\n  \n  if (stationTags) {\n    const tags = currentStation.tags ? currentStation.tags.split(',') : [];\n    stationTags.innerHTML = tags.map(tag => `<span class=\"tag-vignette\">${tag.trim()}<\/span>`).join('');\n    stationTags.addEventListener('click', handleTagClick);\n  }\n  \n  if (stationBitrate) stationBitrate.textContent = `D\u00e9bit binaire : ${currentStation.bitrate || 'Inconnu'} kbps`;\n}\n\nfunction performSearch(tag) {\n  showLoadingAnimation();\n  const query = tag || (searchInput ? searchInput.value.trim() : '');\n  const category = $('#category-select').val();\n  let url = 'https:\/\/de1.api.radio-browser.info\/json\/stations\/search?limit=1000&country=France';\n  \n  if (query || category) {\n    if (query) {\n      if (tag) {\n        url += `&tag=${encodeURIComponent(query)}`;\n      } else {\n        url += `&name=${encodeURIComponent(query)}`;\n      }\n    }\n    if (category && !tag) {\n      url += `&tag=${encodeURIComponent(category)}`;\n    }\n  }\n\n  axios.get(url)\n    .then(response => {\n      if (response && response.data) {\n        allStations = response.data\n          .filter(station => station.url_resolved && station.url_resolved.startsWith('https:\/\/'))\n          .sort((a, b) => a.name.localeCompare(b.name));\n        totalPages = Math.ceil(allStations.length \/ stationsPerPage);\n        currentPage = 1;\n        currentTab = 'all';\n        document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));\n        document.querySelector('.tab[data-tab=\"all\"]').classList.add('active');\n        displayResults();\n        updatePagination();\n        fetchPopularRadios(); \n      } else {\n        throw new Error('Invalid response data');\n      }\n    })\n    .catch(error => {\n      console.error('Error fetching radio stations:', error);\n      if (resultsContainer) {\n        resultsContainer.innerHTML = '<p>Erreur lors de la r\u00e9cup\u00e9ration des stations de radio. Veuillez r\u00e9essayer.<\/p>';\n      }\n      if (paginationContainer) {\n        paginationContainer.style.display = 'none';\n      }\n    })\n    .finally(() => {\n      hideLoadingAnimation();\n    });\n}\n\nfunction displayResults() {\n  if (!resultsContainer) return;\n\n  resultsContainer.innerHTML = '';\n  const categoryVignettesContainer = document.querySelector('.category-vignettes-container');\n  categoryVignettesContainer.innerHTML = '';\n  let stationsToShow = [];\n\n  if (currentTab === 'all') {\n    const startIndex = (currentPage - 1) * stationsPerPage;\n    const endIndex = startIndex + stationsPerPage;\n    stationsToShow = allStations.slice(startIndex, endIndex);\n  } else if (currentTab === 'favorites') {\n    const startIndex = (currentPage - 1) * stationsPerPage;\n    const endIndex = startIndex + stationsPerPage;\n    stationsToShow = favorites.slice(startIndex, endIndex);\n  } else if (currentTab === 'history') {\n    const startIndex = (currentPage - 1) * stationsPerPage;\n    const endIndex = startIndex + stationsPerPage;\n    stationsToShow = history.slice(startIndex, endIndex);\n  }\n\n  const totalStations = currentTab === 'all' ? allStations.length : \n                        currentTab === 'favorites' ? favorites.length : \n                        currentTab === 'history' ? history.length : 0;\n  const resultsCountElement = document.getElementById('results-count');\n  if (resultsCountElement) {\n    resultsCountElement.textContent = `${totalStations} station${totalStations !== 1 ? 's' : ''} de radio trouv\u00e9e${totalStations !== 1 ? 's' : ''}`;\n  }\n\n  const categories = extractCategories(stationsToShow);\n  const categoryVignettes = renderCategoryVignettes(categories);\n  categoryVignettesContainer.innerHTML = categoryVignettes;\n\n  if (stationsToShow.length === 0) {\n    resultsContainer.innerHTML += '<p>Aucune station trouv\u00e9e. Essayez une autre recherche ou un autre onglet.<\/p>';\n    if (paginationContainer) {\n      paginationContainer.style.display = 'none';\n    }\n    return;\n  }\n  \n  stationsToShow.forEach(station => {\n    if (!station) return;\n\n    const stationCard = document.createElement('div');\n    stationCard.className = 'station-card';\n    stationCard.innerHTML = `\n      <div class=\"station-info\">\n        <img decoding=\"async\" class=\"station-logo\" src=\"${station.favicon || 'https:\/\/pacific-webtools.com\/radio-online\/wp-content\/uploads\/2024\/10\/logo-15.webp'}\" alt=\"${station.name} logo\">\n      <\/div>\n      <div class=\"station-details\">\n        <h2>${station.name || 'Station inconnue'}<\/h2>\n        <p>\n          <img decoding=\"async\" class=\"country-flag\" src=\"https:\/\/flagcdn.com\/w20\/${(station.countrycode || '').toLowerCase()}.png\" alt=\"${station.country || 'Inconnu'} flag\">\n          ${station.country || 'France'}\n        <\/p>\n      <\/div>\n      <button class=\"play-button\" data-url=\"${station.url_resolved || ''}\">\n        <img decoding=\"async\" src=\"https:\/\/pacific-web-tools.com\/radio-online\/wp-content\/uploads\/2024\/10\/logo-16.webp\" alt=\"Ic\u00f4ne de lecture\">\n      <\/button>\n      <button class=\"favorite-button ${favorites.some(fav => fav.stationuuid === station.stationuuid) ? 'active' : ''}\">\n      <\/button>\n    `;\n    resultsContainer.appendChild(stationCard);\n\n    const playButton = stationCard.querySelector('.play-button');\n    if (playButton) {\n      playButton.addEventListener('click', () => playStation(station));\n    }\n\n    const favoriteButton = stationCard.querySelector('.favorite-button');\n    if (favoriteButton) {\n      favoriteButton.addEventListener('click', () => toggleFavorite(station));\n    }\n  });\n\n  updatePagination();\n}\n\nfunction toggleFavorite(station) {\n  const index = favorites.findIndex(fav => fav.stationuuid === station.stationuuid);\n  if (index === -1) {\n    favorites.push(station);\n  } else {\n    favorites.splice(index, 1);\n  }\n  localStorage.setItem('favorites', JSON.stringify(favorites));\n  displayResults();\n}\n\nfunction addToHistory(station) {\n  const index = history.findIndex(item => item.stationuuid === station.stationuuid);\n  if (index !== -1) {\n    history.splice(index, 1);\n  }\n  history.unshift(station);\n  if (history.length > 20) {\n    history.pop();\n  }\n  localStorage.setItem('history', JSON.stringify(history));\n}\n\nfunction updatePagination() {\n  if (!pageNumbersContainer) return;\n\n  const totalStations = currentTab === 'all' ? allStations.length : \n                        currentTab === 'favorites' ? favorites.length : \n                        currentTab === 'history' ? history.length : 0;\n\n  totalPages = Math.ceil(totalStations \/ stationsPerPage);\n\n  if (totalStations <= stationsPerPage) {\n    if (paginationContainer) paginationContainer.style.display = 'none';\n    return;\n  }\n\n  const maxVisiblePages = 5;\n  let startPage = Math.max(currentPage - Math.floor(maxVisiblePages \/ 2), 1);\n  let endPage = Math.min(startPage + maxVisiblePages - 1, totalPages);\n\n  if (endPage - startPage + 1 < maxVisiblePages) {\n    startPage = Math.max(endPage - maxVisiblePages + 1, 1);\n  }\n\n  pageNumbersContainer.innerHTML = '';\n\n  for (let i = startPage; i <= endPage; i++) {\n    const pageButton = document.createElement('button');\n    pageButton.classList.add('page-number');\n    pageButton.textContent = i;\n    if (i === currentPage) {\n      pageButton.classList.add('active');\n    }\n    pageButton.addEventListener('click', () => {\n      currentPage = i;\n      displayResults();\n      updatePagination();\n    });\n    pageNumbersContainer.appendChild(pageButton);\n  }\n\n  if (prevButton) prevButton.disabled = currentPage === 1;\n  if (nextButton) nextButton.disabled = currentPage === totalPages;\n\n  if (paginationContainer) paginationContainer.style.display = 'flex';\n}\n\nfunction fetchAllStations() {\n  showLoadingAnimation();\n  let url = 'https:\/\/de1.api.radio-browser.info\/json\/stations\/search?limit=1000&country=France';\n\n  axios.get(url)\n    .then(response => {\n      if (response && response.data) {\n        allStations = response.data\n          .filter(station => station.url_resolved && station.url_resolved.startsWith('https:\/\/'))\n          .sort((a, b) => a.name.localeCompare(b.name));\n        totalPages = Math.ceil(allStations.length \/ stationsPerPage);\n        currentPage = 1;\n        displayResults();\n        updatePagination();\n        fetchPopularRadios(); \n      } else {\n        throw new Error('Invalid response data');\n      }\n    })\n    .catch(error => {\n      console.error('Error fetching radio stations:', error);\n      if (resultsContainer) resultsContainer.innerHTML = '<p>Erreur lors de la r\u00e9cup\u00e9ration des stations de radio. Veuillez r\u00e9essayer.<\/p>';\n    })\n    .finally(() => {\n      hideLoadingAnimation();\n    });\n}\n\n$(document).ready(function() {\n  $('#category-select').select2({\n    placeholder: 'S\u00e9lectionner une cat\u00e9gorie',\n    allowClear: true,\n    tags: true,\n    ajax: {\n      url: 'https:\/\/de1.api.radio-browser.info\/json\/tags?country=France',\n      dataType: 'json',\n      delay: 250,\n      data: function (params) {\n        return {\n          search: params.term\n        };\n      },\n      processResults: function (data, params) {\n        const searchTerm = params.term ? params.term.toLowerCase() : '';\n        return {\n          results: data\n            .filter(tag => tag.name.toLowerCase().includes(searchTerm))\n            .map(tag => ({\n              id: tag.name,\n              text: tag.name\n            }))\n        };\n      },\n      cache: true\n    }\n  });\n\n  $('#category-select').on('select2:select select2:unselect', function(e) {\n    performSearch();\n  });\n  \n  document.querySelectorAll('.tab').forEach(tab => {\n    tab.addEventListener('click', () => {\n      document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));\n      tab.classList.add('active');\n      currentTab = tab.dataset.tab;\n      currentPage = 1;\n      displayResults();\n    });\n  });\n\n  if (searchButton) {\n    searchButton.addEventListener('click', () => performSearch());\n  }\n\n  if (searchInput) {\n    searchInput.addEventListener('keypress', function(event) {\n      if (event.key === 'Enter') {\n        event.preventDefault();\n        performSearch();\n      }\n    });\n  }\n\n  if (prevButton) {\n    prevButton.addEventListener('click', () => {\n      if (currentPage > 1) {\n        currentPage--;\n        displayResults();\n        updatePagination();\n      }\n    });\n  }\n\n  if (nextButton) {\n    nextButton.addEventListener('click', () => {\n      if (currentPage < totalPages) {\n        currentPage++;\n        displayResults();\n        updatePagination();\n      }\n    });\n  }\n\n  fetchAllStations();  \n});\n\nlet allStations = [];\n\nfunction openModal() {\n  if (playerModal) playerModal.style.display = 'block';\n  if (window.chrome && window.chrome.cast && window.chrome.cast.isAvailable) {\n    initializeCastApi();\n  }\n}\n\nfunction closeModal() {\n  if (playerModal) playerModal.style.display = 'none';\n  audioElement.pause();\n}\n\nfunction startChromecast() {\n  if (!currentStation) return;\n\n  const castSession = cast.framework.CastContext.getInstance().getCurrentSession();\n  if (castSession) {\n    const mediaInfo = new chrome.cast.media.MediaInfo(currentStation.url_resolved, 'audio\/mp3');\n    mediaInfo.metadata = new chrome.cast.media.GenericMediaMetadata();\n    mediaInfo.metadata.title = currentStation.name;\n    mediaInfo.metadata.images = [{ url: currentStation.favicon || 'https:\/\/pacific-webtools.com\/radio-online\/wp-content\/uploads\/2024\/10\/logo-15.webp' }];\n\n    const request = new chrome.cast.media.LoadRequest(mediaInfo);\n    castSession.loadMedia(request).then(\n      function() { console.log('Load succeed'); },\n      function(errorCode) { console.log('Error code: ' + errorCode); }\n    );\n  } else {\n    cast.framework.CastContext.getInstance().requestSession();\n  }\n}\n\nif (chromecastButton) {\n  chromecastButton.addEventListener('click', startChromecast);\n}\n\n\/\/ Load the Cast framework\nwindow.__onGCastApiAvailable = function(isAvailable) {\n  if (isAvailable) {\n    initializeCastApi();\n  }\n};\n\n\/\/ Initialize the Cast API\nfunction initializeCastApi() {\n  cast.framework.CastContext.getInstance().setOptions({\n    receiverApplicationId: chrome.cast.media.DEFAULT_MEDIA_RECEIVER_APP_ID,\n    autoJoinPolicy: chrome.cast.AutoJoinPolicy.ORIGIN_SCOPED\n  });\n}\n\n\/\/ Player controls\nif (playPauseButton) playPauseButton.addEventListener('click', togglePlayPause);\nif (volumeSlider) volumeSlider.addEventListener('input', adjustVolume);\nif (muteUnmuteButton) muteUnmuteButton.addEventListener('click', toggleMute);\nif (closeModalButton) closeModalButton.addEventListener('click', closeModal);\nwindow.addEventListener('click', (event) => {\n  if (event.target == playerModal) {\n    closeModal();\n  }\n});\n\nfunction togglePlayPause() {\n  if (!playPauseButton) return;\n\n  if (audioElement.paused) {\n    audioElement.play().catch(error => console.error('Error playing audio:', error));\n    playPauseButton.querySelector('img').src = \"https:\/\/cdn-icons-png.freepik.com\/512\/4181\/4181135.png\";\n    playPauseButton.querySelector('img').alt = \"Ic\u00f4ne de pause\";\n  } else {\n    audioElement.pause();\n    playPauseButton.querySelector('img').src = \"https:\/\/cdn-icons-png.flaticon.com\/512\/2468\/2468825.png\";\n    playPauseButton.querySelector('img').alt = \"Ic\u00f4ne de lecture\";\n  }\n}\n\nfunction adjustVolume() {\n  if (volumeSlider) audioElement.volume = volumeSlider.value;\n}\n\nfunction toggleMute() {\n  audioElement.muted = !audioElement.muted;\n}\n\nfunction updateMuteButton() {\n  if (!muteUnmuteButton) return;\n\n  const muteImg = muteUnmuteButton.querySelector('img');\n  if (audioElement.muted || audioElement.volume === 0) {\n    muteImg.src = \"https:\/\/cdn-icons-png.flaticon.com\/512\/9604\/9604571.png\";\n    muteImg.alt = \"D\u00e9sactiver le son\";\n  } else {\n    muteImg.src = \"https:\/\/cdn-icons-png.flaticon.com\/512\/9604\/9604571.png\";\n    muteImg.alt = \"Activer le son\";\n  }\n}\n\n\/\/ Initialize volume\nadjustVolume();\n\n\/\/ Add background cycling function\nfunction cycleBackgroundImages() {\n  const slides = document.querySelectorAll('.background-slideshow .slide');\n  let currentSlide = 0;\n\n  setInterval(() => {\n    slides[currentSlide].classList.remove('active');\n    currentSlide = (currentSlide + 1) % slides.length;\n    slides[currentSlide].classList.add('active');\n  }, 5000);\n}\n\n\/\/ Call the cycling function when the document is ready\ndocument.addEventListener('DOMContentLoaded', cycleBackgroundImages);\n<\/script>\n\n\n<\/body><\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-19a4604 e-con-full e-flex e-con e-parent\" data-id=\"19a4604\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b2f5ed0 elementor-widget elementor-widget-html\" data-id=\"b2f5ed0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<html><head>\n  <meta name=\" viewport\"=\"\" content=\"width=device-width, initial-scale=1.0\">\n  <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n  <style>\n    .rs-carousel-section {\n      padding: 50px 0; \n      background: linear-gradient(45deg, #1a1a1a, #2c2c2c, #0e4d4d);\n      background-size: 400% 400%;\n      animation: rs-gradientBG 15s ease infinite;\n      color: #ffffff;\n      font-family: 'Roboto', sans-serif;\n      min-height: flex; \n      display: flex;\n      flex-direction: column;\n      align-items: center;\n    }\n\n    .rs-title {\n      color: #00ffff;\n      text-align: center;\n      margin: 2rem 0;\n      font-size: 2rem;\n      text-shadow: 0 0 10px rgba(0, 255, 255, 0.5);\n    }\n\n    .rs-carousel-container {\n      width: 100%;\n      position: relative;\n      padding: 20px 250px; \n      box-sizing: border-box;\n      overflow: hidden;\n      margin: 0 auto; \n    }\n\n    .rs-carousel {\n      display: flex;\n      overflow: hidden;\n      scroll-behavior: smooth;\n      gap: 20px;\n      padding: 20px 0 0 0;\n      transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    .rs-radio-card {\n      min-width: 250px;\n      flex: 0 0 250px;\n      background: rgba(255, 255, 255, 0.1);\n      border-radius: 15px;\n      text-align: center;\n      transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\n      border: 2px solid #00ffff;\n      box-shadow: 0 0 15px rgba(0, 255, 255, 0.2);\n      position: relative;\n      overflow: hidden;\n      transform-origin: center center;\n      padding: 20px 15px; \/* Add consistent padding *\/\n    }\n\n    .rs-radio-card.rs-scrolling {\n      transform: scale(0.95) rotate(-2deg);\n    }\n\n    .rs-radio-card::before {\n      content: '';\n      position: absolute;\n      top: 0;\n      left: -100%;\n      width: 100%;\n      height: 100%;\n      background: linear-gradient(90deg, transparent, rgba(0, 255, 255, 0.1), transparent);\n      transition: 0.5s;\n    }\n\n    .rs-radio-card:hover::before {\n      left: 100%;\n    }\n\n    .rs-radio-card:hover {\n      transform: translateY(-5px) scale(1.02);\n      box-shadow: 0 10px 30px rgba(0, 255, 255, 0.3);\n      z-index: 1;\n    }\n\n    .rs-radio-logo {\n      width: 120px;\n      height: 120px;\n      border-radius: 50%;\n      margin-bottom: 1rem;\n      border: 3px solid #00ffff;\n      box-shadow: 0 0 20px rgba(0, 255, 255, 0.3);\n      transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);\n      cursor: pointer; \/* Add cursor pointer to indicate interactivity *\/\n    }\n\n    .rs-radio-logo:hover {\n      transform: rotateY(180deg) scale(1.15);\n      border-color: #ff00ff;\n      box-shadow: \n        0 0 25px rgba(0, 255, 255, 0.5),\n        0 0 50px rgba(255, 0, 255, 0.3);\n      animation: logoGlow 1.5s infinite alternate;\n    }\n\n    @keyframes logoGlow {\n      0% {\n        box-shadow: 0 0 25px rgba(0, 255, 255, 0.5),\n                    0 0 50px rgba(255, 0, 255, 0.3);\n      }\n      100% {\n        box-shadow: 0 0 35px rgba(0, 255, 255, 0.8),\n                    0 0 70px rgba(255, 0, 255, 0.6);\n      }\n    }\n\n    .rs-radio-name {\n      font-size: 1.2rem; \/* Reduced from 1.5rem *\/\n      margin: 15px 0;\n      color: #00ffff;\n      transition: all 0.3s ease;\n      position: relative; \/* Added *\/\n    }\n\n    \/* Add hover state for radio name span elements *\/\n    .rs-radio-name span:first-child {\n      display: inline-block;\n      transition: opacity 0.3s ease;\n    }\n\n    .rs-radio-name span:last-child {\n      position: absolute;\n      left: 50%;\n      transform: translateX(-50%);\n      opacity: 0;\n      transition: opacity 0.3s ease;\n      width: 100%;\n    }\n\n    .rs-radio-card:hover .rs-radio-name span:first-child {\n      opacity: 0;\n    }\n\n    .rs-radio-card:hover .rs-radio-name span:last-child {\n      opacity: 1;\n    }\n\n    .rs-listen-button {\n      position: relative; \/* Add this *\/\n      background: #00ffff;\n      color: #000;\n      width: 60px;\n      height: 60px;\n      border: none;\n      border-radius: 50%;\n      font-size: 1.5rem;\n      cursor: pointer;\n      transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\n      text-decoration: none;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      margin: 1rem auto;\n      overflow: hidden;\n    }\n\n    .rs-listen-button:hover {\n      background: #00cccc;\n      transform: scale(1.1) rotate(360deg);\n      box-shadow: 0 0 20px rgba(0, 255, 255, 0.6);\n    }\n\n    .rs-listen-button::before {\n      content: \"Voir la webradio\";\n      position: absolute;\n      bottom: -30px;\n      left: 50%;\n      transform: translateX(-50%);\n      background: rgba(0, 255, 255, 0.9);\n      color: #000;\n      padding: 5px 10px;\n      border-radius: 4px;\n      font-size: 12px;\n      white-space: nowrap;\n      opacity: 0;\n      visibility: hidden;\n      transition: all 0.3s ease;\n    }\n\n    .rs-listen-button:hover::before {\n      opacity: 1;\n      visibility: visible;\n      bottom: -35px;\n    }\n\n    .rs-listen-button:hover i {\n      animation: rs-colorChange 2s infinite;\n    }\n\n    @keyframes rs-colorChange {\n      0% { color: #ff0000; }\n      20% { color: #ff7700; }\n      40% { color: #ffff00; }\n      60% { color: #00ff00; }\n      80% { color: #0000ff; }\n      100% { color: #ff0000; }\n    }\n\n    .rs-listen-button::after {\n      content: '';\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      background: radial-gradient(circle, transparent 30%, rgba(255, 255, 255, 0.3) 70%);\n      animation: rs-pulseGlow 2s infinite;\n      opacity: 0;\n      transition: opacity 0.3s;\n    }\n\n    .rs-listen-button:hover::after {\n      opacity: 1;\n    }\n\n    @keyframes rs-pulseGlow {\n      0% {\n        transform: scale(0.95);\n        opacity: 0.5;\n      }\n      50% {\n        transform: scale(1.1);\n        opacity: 0.2;\n      }\n      100% {\n        transform: scale(0.95);\n        opacity: 0.5;\n      }\n    }\n\n    .rs-carousel-button {\n      position: absolute;\n      top: 50%;\n      transform: translateY(-50%);\n      background: rgba(0, 255, 255, 0.2);\n      border: none;\n      width: 40px;\n      height: 40px;\n      border-radius: 50%;\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: #00ffff;\n      font-size: 1.5rem;\n      transition: all 0.3s ease;\n      z-index: 2;\n      overflow: hidden; \/* Add this for ripple effect *\/\n    }\n\n    .rs-carousel-button:hover {\n      background: rgba(0, 255, 255, 0.2);\n      transform: translateY(-50%) scale(1.1);\n      box-shadow: 0 0 15px rgba(0, 255, 255, 0.5);\n    }\n\n    .rs-carousel-button::before {\n      content: '';\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      background: radial-gradient(circle at center, rgba(0, 255, 255, 0.8) 0%, transparent 70%);\n      transform: scale(0);\n      opacity: 0;\n      transition: transform 0.5s ease-out, opacity 0.3s ease;\n    }\n\n    .rs-carousel-button:hover::before {\n      transform: scale(2);\n      opacity: 0.3;\n    }\n\n    .rs-carousel-button:hover i {\n      animation: arrowBounce 0.5s ease infinite alternate;\n    }\n\n    @keyframes arrowBounce {\n      from {\n        transform: translateX(0);\n      }\n      to {\n        transform: translateX(3px);\n      }\n    }\n\n    .rs-carousel-button.rs-prev:hover i {\n      animation: arrowBounceLeft 0.5s ease infinite alternate;\n    }\n\n    @keyframes arrowBounceLeft {\n      from {\n        transform: translateX(0);\n      }\n      to {\n        transform: translateX(-3px);\n      }\n    }\n\n    .rs-carousel-button.rs-prev {\n      left: 0;\n    }\n\n    .rs-carousel-button.rs-next {\n      right: 0;\n    }\n\n    @keyframes rs-floatingNotesCard {\n      0% {\n        opacity: 0;\n        transform: translate(0, 0) rotate(0deg);\n      }\n      50% {\n        opacity: 1;\n      }\n      100% {\n        opacity: 0;\n        transform: translate(-50px, -50px) rotate(360deg);\n      }\n    }\n\n    .rs-card-notes {\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      top: 0;\n      left: 0;\n      pointer-events: none;\n      opacity: 0;\n      transition: opacity 0.3s;\n    }\n\n    .rs-radio-card:hover .rs-card-notes {\n      opacity: 1;\n    }\n\n    .rs-card-note {\n      position: absolute;\n      font-size: 20px;\n      color: #00ffff;\n      animation: rs-floatingNotesCard 2s ease-out infinite;\n    }\n\n    .rs-card-note-1 { top: 10%; left: 10%; animation-delay: 0s; }\n    .rs-card-note-2 { top: 5%; left: 30%; animation-delay: 0.3s; }\n    .rs-card-note-3 { top: 15%; left: 50%; animation-delay: 0.6s; }\n    .rs-card-note-4 { top: 8%; left: 70%; animation-delay: 0.9s; }\n    .rs-card-note-5 { top: 12%; left: 90%; animation-delay: 1.2s; }\n\n    .rs-radio-tag {\n      position: absolute;\n      top: 10px;\n      right: 10px;\n      padding: 5px 12px;\n      font-size: 0.8rem;\n      border-radius: 15px;\n      background: rgba(0, 0, 0, 0.7);\n      color: #fff;\n      border: 1px solid #00ffff;\n      box-shadow: 0 0 5px #00ffff,\n                  inset 0 0 5px #00ffff;\n      text-transform: uppercase;\n      letter-spacing: 1px;\n      transition: all 0.3s ease;\n      transform-style: preserve-3d;\n      perspective: 1000px;\n      cursor: pointer;\n    }\n    \n    .rs-radio-tag i {\n      margin-right: 5px;\n      color: #00ffff;\n      text-shadow: 0 0 5px #00ffff,\n                   0 0 10px #00ffff,\n                   0 0 15px #00ffff;\n    }\n\n    \/* Add hover effects *\/\n    .rs-radio-tag:hover {\n      transform: translateZ(20px) rotateX(10deg) rotateY(-10deg);\n      box-shadow: 0 0 15px #00ffff,\n                  inset 0 0 10px #00ffff,\n                  0 10px 20px rgba(0, 255, 255, 0.4);\n      background: rgba(0, 255, 255, 0.1);\n      letter-spacing: 2px;\n      animation: tagFloat 1s ease-in-out infinite alternate;\n    }\n\n    \/* Add new keyframe animation *\/\n    @keyframes tagFloat {\n      0% {\n        transform: translateZ(20px) rotateX(10deg) rotateY(-10deg);\n      }\n      100% {\n        transform: translateZ(30px) rotateX(15deg) rotateY(-15deg);\n        text-shadow: 2px 2px 4px rgba(0, 255, 255, 0.6);\n      }\n    }\n\n    \/* Add before\/after elements for 3D effect *\/\n    .rs-radio-tag::before {\n      content: '';\n      position: absolute;\n      inset: -2px;\n      background: linear-gradient(45deg, transparent, rgba(0, 255, 255, 0.3), transparent);\n      transform: translateZ(-1px);\n      opacity: 0;\n      transition: opacity 0.3s ease;\n    }\n\n    .rs-radio-tag::after {\n      content: '';\n      position: absolute;\n      inset: -1px;\n      background: linear-gradient(-45deg, transparent, rgba(0, 255, 255, 0.2), transparent);\n      transform: translateZ(-2px);\n      opacity: 0;\n      transition: opacity 0.3s ease;\n    }\n\n    .rs-radio-tag:hover::before,\n    .rs-radio-tag:hover::after {\n      opacity: 1;\n    }\n\n    @keyframes rs-floatingNotes {\n      0% {\n        transform: translateY(0) rotate(0deg) scale(1);\n        opacity: 0;\n      }\n      50% {\n        transform: translateY(-20px) rotate(180deg) scale(1.2);\n        opacity: 1;\n      }\n      100% {\n        transform: translateY(-40px) rotate(360deg) scale(1);\n        opacity: 0;\n      }\n    }\n\n    @media (max-width: 768px) {\n      .rs-carousel-section {\n        padding: 30px 0;\n      }\n      .rs-carousel-container {\n        padding: 15px 20px; \n      }\n      .rs-radio-card {\n        min-width: 250px !important; \/* Reduced by 20% from original 312.5px *\/\n        flex: 0 0 250px !important; \/* Reduced by 20% from original 312.5px *\/\n      }\n      \/* Content size reductions *\/\n      .rs-radio-logo {\n        width: 84px !important;\n        height: 84px !important;\n      }\n      .rs-radio-name {\n        font-size: 1rem !important;\n      }\n      .rs-listen-button {\n        width: 48px;\n        height: 48px;\n      }\n    }\n\n    @media (max-width: 480px) {\n      .rs-carousel-section {\n        padding: 20px 0;\n      }\n      .rs-carousel-container {\n        padding: 0 30px; \n      }\n      .rs-radio-card {\n        min-width: 200px !important; \/* Further reduced by 20% from tablet size *\/\n        flex: 0 0 200px !important; \/* Further reduced by 20% from tablet size *\/\n      }\n      \/* Further reduce content for smallest screens *\/\n      .rs-radio-logo {\n        width: 76px !important;\n        height: 76px !important;\n        margin: 8px auto 12px !important;\n      }\n      .rs-radio-name {\n        font-size: 0.9rem !important;\n      }\n      .rs-listen-button {\n        width: 40px;\n        height: 40px;\n      }\n    }\n  <\/style>\n<\/head>\n<body>\n  <div class=\"rs-carousel-section\" id=\"radioendirect-carousel-section\">\n    <h2 class=\"rs-title\" id=\"radioendirect-title\" style=\"font-size: 24px; animation: textGlow 2s infinite; text-shadow: 0 0 10px rgba(0, 255, 255, 0.5), 0 0 20px rgba(0, 255, 255, 0.3), 0 0 30px rgba(0, 255, 255, 0.2); position: relative;\">\n  Nos suggestions de radios fran\u00e7aises en direct :\n<\/h2>\n    \n    <div class=\"rs-carousel-container\" id=\"radioendirect-container\">\n      <button class=\"rs-carousel-button rs-prev\" id=\"radioendirect-prev-button\">\n        <i class=\"fas fa-chevron-left\"><\/i>\n      <\/button>\n      \n      <div class=\"rs-carousel\" id=\"radioendirect-carousel\" style=\"gap: 25px;\">\n        <!-- Nostalgie -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-nostalgie\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/play-lh.googleusercontent.com\/9h9jwQQONGEHGuKQ9nBAcXeorzgJZnStMvLZ4DNBVxb4XK3TMww-7sw3_mgjXEw3Gtk\" alt=\"Radio Nostalgie\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-music\"><\/i>Oldies<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>Nostalgie<\/span>\n            <span>Ecoutez en direct Nostalgie<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-nostalgie\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n        <!-- Skyrock -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-skyrock\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/encrypted-tbn0.gstatic.com\/images?q=tbn:ANd9GcSQPI_29sdyigH1bVf4vwKNiM_alqz_mPWkpg&amp;s\" alt=\"Skyrock Radio\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px; margin: 10px auto 15px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-music\"><\/i>Hip-Hop\/Rap<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>Skyrock<\/span>\n            <span>Ecoutez en direct Skyrock<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-skyrock\/\" class=\"rs-listen-button\" style=\"margin: 15px auto 10px;\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n        <!-- Oui FM -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-ouifm\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/upload.wikimedia.org\/wikipedia\/fr\/3\/33\/Oui_FM_2014_logo.png\" alt=\"OUI FM logo\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-guitar\"><\/i>Rock<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>OUI FM<\/span>\n            <span>Ecoutez en direct OUI FM<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-oui-fm\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n        <!-- FIP -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-fip\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/api.theatredelaville-paris.com\/assets\/w300-h300-q70\/4c672c18\/fip_logo.png\" alt=\"FIP Radio\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-music\"><\/i>Eclectique<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>FIP<\/span>\n            <span>Ecoutez en direct FIP<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-fip\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n        \n        <!-- Add after the FIP card and before RMC -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-cheriefm\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/encrypted-tbn0.gstatic.com\/images?q=tbn:ANd9GcRqDXL7XUgfkYyaczESXMRcGb0tP07fBd2h5A&s\" alt=\"Ch\u00e9rie FM Radio\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-music\"><\/i>Pop\/Love<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>Ch\u00e9rie FM<\/span>\n            <span>Ecoutez en direct Ch\u00e9rie FM<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-cheriefm\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n        <!-- Ch\u00e9rie FM -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-cheriefm\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          \n          <img decoding=\"async\" src=\"https:\/\/upload.wikimedia.org\/wikipedia\/fr\/1\/19\/RFM_logo_2011.png\" alt=\"RFM\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-music\"><\/i>80s<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>RFM<\/span>\n            <span>Ecoutez en direct RFM<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-rfm\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n        <!-- Ch\u00e9rie FM -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-cheriefm\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/cdn.uc.assets.prezly.com\/b1be11c1-7593-48e0-b0d3-dfedd93ef5a2\/\" alt=\"NRJ Radio\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-music\"><\/i>Pop\/Dance<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>NRJ<\/span>\n            <span>Ecoutez en direct NRJ<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-nrj\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n        <!-- RTL2 -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-rtl2\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/upload.wikimedia.org\/wikipedia\/fr\/thumb\/f\/fa\/RTL2_logo_2015.svg\/1200px-RTL2_logo_2015.svg.png\" alt=\"RTL2 Radio\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-music\"><\/i>Pop\/Rock<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>RTL2<\/span>\n            <span>Ecoutez en direct RTL2<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-rtl2\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n        \n        <div class=\"rs-radio-card\" id=\"radioendirect-card-sudradio\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <!-- RTL -->\n          <div class=\"rs-radio-card\" id=\"radioendirect-card-rtl\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n            <div class=\"rs-card-notes\">\n              <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n              <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n              <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n              <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n              <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n            <\/div>\n            <img decoding=\"async\" src=\"https:\/\/upload.wikimedia.org\/wikipedia\/commons\/thumb\/5\/51\/RTL_logo.svg\/1200px-RTL_logo.svg.png\" alt=\"RTL Radio\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n            <span class=\"rs-radio-tag\"><i class=\"fas fa-microphone\"><\/i>Info\/Talk<\/span>\n            <h2 class=\"rs-radio-name\">\n              <span>RTL<\/span>\n              <span>Ecoutez en direct RTL<\/span>\n            <\/h2>\n            <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-rtl\/\" class=\"rs-listen-button\">\n              <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n            <\/a>\n          <\/div>\n        \n        <!-- RMC -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-rmc\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/yt3.googleusercontent.com\/ytc\/AIdro_k7rcILtB71q3kwlCwX14_jfamwiA4_U74MX8PZ6-sC7Rk=s900-c-k-c0x00ffffff-no-rj\" alt=\"RMC Radio\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-microphone\"><\/i>Info\/Sport<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>RMC<\/span>\n            <span>Ecoutez en direct RMC<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-rmc\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n        <!-- Europe 1 -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-europe1\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/cdn-europe1.lanmedia.fr\/var\/europe1\/storage\/images\/europe1\/animateurs\/europe-12\/53472641-3-fre-FR\/Europe-1.png\" alt=\"Europe 1\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-microphone\"><\/i>Info\/Talk<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>Europe 1<\/span>\n            <span>Ecoutez en direct Europe 1<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-europe1\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n        \n        <!-- Rire et Chansons -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-rireetchansons\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/encrypted-tbn0.gstatic.com\/images?q=tbn:ANd9GcRGs-8gbq-CxVHtpgHNRgIYFLwJ8yaNPmC-1A&amp;s\" alt=\"Rire et Chansons\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-laugh\"><\/i>Humour<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>Rire et Chansons<\/span>\n            <span>Ecoutez en direct Rire et Chansons<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-rire-et-chansons\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n        <!-- Fun Radio -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-funradio\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/upload.wikimedia.org\/wikipedia\/commons\/e\/ef\/Fun_Radio_2021_logo.png\" alt=\"Fun Radio\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-music\"><\/i>Dance\/Electro<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>Fun Radio<\/span>\n            <span>Ecoutez en direct Fun Radio<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-fun-radio\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n        <!-- France Inter -->\n        <div class=\"rs-radio-card\" id=\"radioendirect-card-franceinter\" style=\"min-width: 312.5px; flex: 0 0 312.5px;\">\n          <div class=\"rs-card-notes\">\n            <span class=\"rs-card-note rs-card-note-1\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-2\">\u266b<\/span>\n            <span class=\"rs-card-note rs-card-note-3\">\u266c<\/span>\n            <span class=\"rs-card-note rs-card-note-4\">\u266a<\/span>\n            <span class=\"rs-card-note rs-card-note-5\">\u266b<\/span>\n          <\/div>\n          <img decoding=\"async\" src=\"https:\/\/upload.wikimedia.org\/wikipedia\/fr\/thumb\/3\/39\/France_Inter_logo.svg\/2048px-France_Inter_logo.svg.png\" alt=\"France Inter\" class=\"rs-radio-logo\" style=\"width: 105px; height: 105px;\">\n          <span class=\"rs-radio-tag\"><i class=\"fas fa-microphone\"><\/i>Info\/Culture<\/span>\n          <h2 class=\"rs-radio-name\">\n            <span>France Inter<\/span>\n            <span>Ecoutez en direct France Inter<\/span>\n          <\/h2>\n          <a href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-france-inter\/\" class=\"rs-listen-button\">\n            <i class=\"fas fa-play\" style=\"font-size: 0.75rem\"><\/i>\n          <\/a>\n        <\/div>\n\n      <\/div>\n\n      <button class=\"rs-carousel-button rs-next\" id=\"radioendirect-next-button\">\n        <i class=\"fas fa-chevron-right\"><\/i>\n      <\/button>\n    <\/div>\n  <\/div>\n\n  <script>\n    (function() {\n      class RadioStreamrCarousel {\n        constructor(selector) {\n          this.container = document.querySelector(selector);\n          this.carousel = this.container.querySelector('.rs-carousel');\n          this.allCards = Array.from(this.container.querySelectorAll('.rs-radio-card')); \/\/ Store all cards\n          this.prevButton = this.container.querySelector('.rs-carousel-button.rs-prev');\n\n          \/\/ Select random 9 cards\n          this.selectRandomCards();\n          \n          \/\/ Initialize properties after cards are selected\n          this.cards = Array.from(this.container.querySelectorAll('.rs-radio-card'));\n          this.currentIndex = 0;\n          this.cardWidth = this.cards[0].offsetWidth + 20;\n          this.cardsPerView = Math.floor(this.carousel.offsetWidth \/ this.cardWidth);\n          this.maxIndex = this.cards.length - this.cardsPerView;\n          this.nextButton = this.container.querySelector('.rs-carousel-button.rs-next');\n\n          this.init();\n        }\n\n        selectRandomCards() {\n          \/\/ Remove all cards from carousel\n          this.allCards.forEach(card => card.remove());\n\n          \/\/ Randomly select 9 cards\n          const shuffled = [...this.allCards].sort(() => 0.5 - Math.random());\n          const selected = shuffled.slice(0, 9);\n          \n          \/\/ Add selected cards back to carousel\n          selected.forEach(card => {\n            this.carousel.appendChild(card);\n          });\n        }\n\n        init() {\n          this.bindEvents();\n        }\n\n        scrollToIndex(index) {\n          \/\/ Handle infinite loop\n          if (index < 0) {\n            this.currentIndex = this.cards.length - this.cardsPerView;\n          } else if (index > this.maxIndex) {\n            this.currentIndex = 0;\n          } else {\n            this.currentIndex = index;\n          }\n          \n          \/\/ Add scrolling class to cards\n          this.cards.forEach(card => {\n            card.classList.add('rs-scrolling');\n            setTimeout(() => card.classList.remove('rs-scrolling'), 500);\n          });\n\n          \/\/ Scroll with animation\n          this.carousel.scrollTo({\n            left: this.currentIndex * this.cardWidth,\n            behavior: 'smooth'\n          });\n\n          \/\/ Create floating notes effect\n          const notes = ['\u266a', '\u266b', '\u266c'];\n          for(let i = 0; i < 3; i++) {\n            const note = document.createElement('span');\n            note.textContent = notes[Math.floor(Math.random() * notes.length)];\n            note.style.cssText = `\n              position: absolute;\n              color: #00ffff;\n              font-size: 24px;\n              top: ${50 + Math.random() * 100}px;\n              left: ${50 + Math.random() * (this.carousel.offsetWidth - 100)}px;\n              animation: rs-floatingNotes 1s ease-out ${i * 0.2}s forwards;\n              pointer-events: none;\n            `;\n            this.carousel.appendChild(note);\n            setTimeout(() => note.remove(), 1000 + i * 200);\n          }\n        }\n\n        bindEvents() {\n          this.prevButton.addEventListener('click', () => this.scrollToIndex(this.currentIndex - 1));\n          this.nextButton.addEventListener('click', () => this.scrollToIndex(this.currentIndex + 1));\n\n          window.addEventListener('resize', () => {\n            const newCardsPerView = Math.floor(this.carousel.offsetWidth \/ this.cardWidth);\n            const newMaxIndex = this.cards.length - newCardsPerView;\n            this.currentIndex = Math.min(this.currentIndex, newMaxIndex);\n            this.scrollToIndex(this.currentIndex);\n          });\n        }\n      }\n\n      document.addEventListener('DOMContentLoaded', function() {\n        new RadioStreamrCarousel('.rs-carousel-section');\n      });\n    })();\n    \n  <\/script>\n<\/body><\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-82121d3 e-con-full e-flex e-con e-parent\" data-id=\"82121d3\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-038657c elementor-widget elementor-widget-shortcode\" data-id=\"038657c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u00d7 \u00c9couter Sud Radio en direct gratuitement \u00c9couter en direct \u00c9coutez les podcasts Date de cr\u00e9ation 1958 Fr\u00e9quence FM 99.9 MHz Histoire de Sud Radio Les d\u00e9buts en Andorre Sud Radio, fond\u00e9e initialement en Andorre, est une radio g\u00e9n\u00e9raliste fran\u00e7aise qui a marqu\u00e9 l&rsquo;histoire de la radiodiffusion. D&rsquo;abord connue sous le nom de Radio Andorre, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":139,"comment_status":"open","ping_status":"open","sticky":false,"template":"elementor_header_footer","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[],"class_list":["post-133","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-radio-dactualites"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.2 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Sud Radio \ud83d\udcf0 - Ecoutez en direct la Webradio - RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct<\/title>\n<meta name=\"description\" content=\"\u00c9coutez Sud Radio gratuitement en direct sur notre webradio ! Acc\u00e9dez aux d\u00e9bats passionn\u00e9s, aux actualit\u00e9s chaudes et aux programmes vari\u00e9s.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Sud Radio \ud83d\udcf0 - Ecoutez en direct la Webradio - RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct\" \/>\n<meta property=\"og:description\" content=\"\u00c9coutez Sud Radio gratuitement en direct sur notre webradio ! Acc\u00e9dez aux d\u00e9bats passionn\u00e9s, aux actualit\u00e9s chaudes et aux programmes vari\u00e9s.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/\" \/>\n<meta property=\"og:site_name\" content=\"RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct\" \/>\n<meta property=\"article:published_time\" content=\"2024-10-28T18:00:40+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-11-17T13:51:28+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/radiostreamr.com\/radio-france\/wp-content\/uploads\/2024\/10\/sud-radio-logo-en-ligne.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"225\" \/>\n\t<meta property=\"og:image:height\" content=\"225\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/\",\"url\":\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/\",\"name\":\"Sud Radio \ud83d\udcf0 - Ecoutez en direct la Webradio - RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct\",\"isPartOf\":{\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/radiostreamr.com\/radio-france\/wp-content\/uploads\/2024\/10\/sud-radio-logo-en-ligne.webp\",\"datePublished\":\"2024-10-28T18:00:40+00:00\",\"dateModified\":\"2024-11-17T13:51:28+00:00\",\"author\":{\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/#\/schema\/person\/8109b41ba8df99078005b58e0274a646\"},\"description\":\"\u00c9coutez Sud Radio gratuitement en direct sur notre webradio ! Acc\u00e9dez aux d\u00e9bats passionn\u00e9s, aux actualit\u00e9s chaudes et aux programmes vari\u00e9s.\",\"breadcrumb\":{\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#primaryimage\",\"url\":\"https:\/\/radiostreamr.com\/radio-france\/wp-content\/uploads\/2024\/10\/sud-radio-logo-en-ligne.webp\",\"contentUrl\":\"https:\/\/radiostreamr.com\/radio-france\/wp-content\/uploads\/2024\/10\/sud-radio-logo-en-ligne.webp\",\"width\":225,\"height\":225,\"caption\":\"Logo fond rouge surd radio\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/radiostreamr.com\/radio-france\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Sud Radio \ud83d\udcf0 &#8211; Ecoutez en direct la Webradio\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/#website\",\"url\":\"https:\/\/radiostreamr.com\/radio-france\/\",\"name\":\"RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct\",\"description\":\"\u00c9coutez les meilleures stations de radio fran\u00e7aises en direct. Musique, actualit\u00e9s, et \u00e9missions locales - disponibles partout, \u00e0 tout moment.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/radiostreamr.com\/radio-france\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/#\/schema\/person\/8109b41ba8df99078005b58e0274a646\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/radiostreamr.com\/radio-france\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"sameAs\":[\"https:\/\/radiostreamr.com\/radio-france\"],\"url\":\"https:\/\/radiostreamr.com\/radio-france\/author\/admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Sud Radio \ud83d\udcf0 - Ecoutez en direct la Webradio - RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct","description":"\u00c9coutez Sud Radio gratuitement en direct sur notre webradio ! Acc\u00e9dez aux d\u00e9bats passionn\u00e9s, aux actualit\u00e9s chaudes et aux programmes vari\u00e9s.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/","og_locale":"fr_FR","og_type":"article","og_title":"Sud Radio \ud83d\udcf0 - Ecoutez en direct la Webradio - RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct","og_description":"\u00c9coutez Sud Radio gratuitement en direct sur notre webradio ! Acc\u00e9dez aux d\u00e9bats passionn\u00e9s, aux actualit\u00e9s chaudes et aux programmes vari\u00e9s.","og_url":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/","og_site_name":"RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct","article_published_time":"2024-10-28T18:00:40+00:00","article_modified_time":"2024-11-17T13:51:28+00:00","og_image":[{"width":225,"height":225,"url":"https:\/\/radiostreamr.com\/radio-france\/wp-content\/uploads\/2024\/10\/sud-radio-logo-en-ligne.webp","type":"image\/webp"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"\u00c9crit par":"admin","Dur\u00e9e de lecture estim\u00e9e":"10 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/","url":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/","name":"Sud Radio \ud83d\udcf0 - Ecoutez en direct la Webradio - RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct","isPartOf":{"@id":"https:\/\/radiostreamr.com\/radio-france\/#website"},"primaryImageOfPage":{"@id":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#primaryimage"},"image":{"@id":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#primaryimage"},"thumbnailUrl":"https:\/\/radiostreamr.com\/radio-france\/wp-content\/uploads\/2024\/10\/sud-radio-logo-en-ligne.webp","datePublished":"2024-10-28T18:00:40+00:00","dateModified":"2024-11-17T13:51:28+00:00","author":{"@id":"https:\/\/radiostreamr.com\/radio-france\/#\/schema\/person\/8109b41ba8df99078005b58e0274a646"},"description":"\u00c9coutez Sud Radio gratuitement en direct sur notre webradio ! Acc\u00e9dez aux d\u00e9bats passionn\u00e9s, aux actualit\u00e9s chaudes et aux programmes vari\u00e9s.","breadcrumb":{"@id":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#primaryimage","url":"https:\/\/radiostreamr.com\/radio-france\/wp-content\/uploads\/2024\/10\/sud-radio-logo-en-ligne.webp","contentUrl":"https:\/\/radiostreamr.com\/radio-france\/wp-content\/uploads\/2024\/10\/sud-radio-logo-en-ligne.webp","width":225,"height":225,"caption":"Logo fond rouge surd radio"},{"@type":"BreadcrumbList","@id":"https:\/\/radiostreamr.com\/radio-france\/ecoutez-en-direct-sud-radio\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/radiostreamr.com\/radio-france\/"},{"@type":"ListItem","position":2,"name":"Sud Radio \ud83d\udcf0 &#8211; Ecoutez en direct la Webradio"}]},{"@type":"WebSite","@id":"https:\/\/radiostreamr.com\/radio-france\/#website","url":"https:\/\/radiostreamr.com\/radio-france\/","name":"RadioStreamR - Ecoutez la Radio fran\u00e7aise en ligne en direct","description":"\u00c9coutez les meilleures stations de radio fran\u00e7aises en direct. Musique, actualit\u00e9s, et \u00e9missions locales - disponibles partout, \u00e0 tout moment.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/radiostreamr.com\/radio-france\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/radiostreamr.com\/radio-france\/#\/schema\/person\/8109b41ba8df99078005b58e0274a646","name":"admin","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/radiostreamr.com\/radio-france\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g","caption":"admin"},"sameAs":["https:\/\/radiostreamr.com\/radio-france"],"url":"https:\/\/radiostreamr.com\/radio-france\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/posts\/133","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/comments?post=133"}],"version-history":[{"count":40,"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/posts\/133\/revisions"}],"predecessor-version":[{"id":1326,"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/posts\/133\/revisions\/1326"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/media\/139"}],"wp:attachment":[{"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/media?parent=133"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/categories?post=133"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/radiostreamr.com\/radio-france\/wp-json\/wp\/v2\/tags?post=133"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}