body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:url(/assets/background-C7ApAvAZ.jpg);background-size:cover;background-attachment:fixed;width:100%}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.logo{margin:15px auto;display:block;position:fixed;top:10px;left:50%;transform:translate(-50%);height:115px;width:auto}button{background:#ffffff26;box-shadow:0 8px 32px #1f26875e;backdrop-filter:blur(10.5px);-webkit-backdrop-filter:blur(10.5px);border-radius:10px;border:1px solid rgba(255,255,255,.18);color:#fff;font-family:-apple-system,BlinkMacSystemFont,sans-serif;font-weight:700;text-align:center;cursor:pointer}.content{width:100%;margin-top:110px}h2{width:100%;text-align:center;color:#fff;font-size:40px;font-weight:700;position:fixed}.version{color:#00000080;font-size:14px;position:fixed;bottom:0;left:20px}a{text-decoration:none}.PlaylistCard{background:#ffffff26;box-shadow:0 8px 32px #1f26875e;backdrop-filter:blur(10.5px);-webkit-backdrop-filter:blur(10.5px);border-radius:10px;border:1px solid rgba(255,255,255,.18);transition-duration:.2s;cursor:pointer;height:100%;width:100%}.titre{color:#fff;font-family:-apple-system,BlinkMacSystemFont,sans-serif;font-size:22px;font-weight:700;display:-webkit-box;-webkit-box-orient:vertical;line-clamp:2;-webkit-line-clamp:2;text-align:center;margin:5px;overflow:hidden}.logoplaylist{width:75%;height:75%;margin:10px auto 0;display:block;border-radius:10px;object-fit:cover}.done{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:green;font-size:200px!important}.Inline{width:100%}.PlaylistCard .DeletePlaylistIcon{position:absolute;top:10px;right:10px;cursor:pointer}.PlaylistCard .DeletePlaylistIcon:hover{color:red}@keyframes fadeIn{0%{transform:translate(-100%)}to{transform:translate(0)}}.PlaylistSelection{display:flex;flex-direction:column}.PlaylistSelection .listPlaylists{display:flex;flex-direction:row;margin-top:130px}.PlaylistSelection .listPlaylists .catalogue{width:250px;position:fixed;left:20px}.PlaylistSelection .listPlaylists .PlaylistsPossibles{flex-grow:1;display:grid;grid-template-columns:repeat(auto-fill,minmax(20%,1fr));gap:20px;margin-left:290px;margin-right:340px}.PlaylistSelection .listPlaylists .panneaudroite{width:300px;position:fixed;right:20px;bottom:15px}.PlaylistSelection .listPlaylists .panneaudroite .Selection{width:300px;top:260px;bottom:90px;height:auto;position:fixed;display:flex;flex-direction:column;background:#011f78c0;box-shadow:0 8px 32px #1f26875e;backdrop-filter:blur(10.5px);-webkit-backdrop-filter:blur(10.5px);border-radius:10px;border:1px solid rgba(255,255,255,.18);right:20px}.PlaylistSelection .listPlaylists .panneaudroite .Selection .Carte_Selection{display:flex;justify-content:space-around;width:100%;color:#fff;font-size:40px;align-items:center;font-weight:700;margin-top:10px}.PlaylistSelection .listPlaylists .panneaudroite .Selection .Carte_Selection .DeleteIconsButon:hover{color:red}.PlaylistSelection .listPlaylists .panneaudroite .Selection .cartesSelectionnees{display:flex;flex-direction:column;margin:20px;overflow-x:scroll;scrollbar-width:none}.PlaylistSelection .listPlaylists .panneaudroite .Selection .cartesSelectionnees .cartes{display:grid;grid-template-columns:40px 1fr 25px;gap:10px;height:40px;margin-bottom:10px;background:#ffffff26;box-shadow:0 8px 32px #1f26875e;backdrop-filter:blur(10.5px);-webkit-backdrop-filter:blur(10.5px);border-radius:10px;border:1px solid rgba(255,255,255,.18);color:#fff;padding:5px;align-items:center;animation:fadeIn .5s ease-out}.PlaylistSelection .listPlaylists .panneaudroite .Selection .cartesSelectionnees .cartes .nomplaylistselection{display:flex;align-items:center;text-align:left;height:38px;overflow:hidden}.PlaylistSelection .listPlaylists .panneaudroite .Selection .cartesSelectionnees .cartes img{width:100%;border-radius:10%}.PlaylistSelection .listPlaylists .panneaudroite .Selection .cartesSelectionnees .cartes .DeletePlaylist{cursor:pointer}.PlaylistSelection .listPlaylists .panneaudroite .Selection .cartesSelectionnees .cartes .DeletePlaylist .DeletePlaylistIcon{font-size:20px}.PlaylistSelection .listPlaylists .panneaudroite .Selection .cartesSelectionnees .cartes .DeletePlaylist .DeletePlaylistIcon:hover{color:red}.PlaylistSelection .listPlaylists .panneaudroite .Selection .Validations{margin-top:auto;margin-bottom:5px;display:flex;flex-direction:column}.PlaylistSelection .listPlaylists .panneaudroite .Selection .Validations button{padding:10px;font-size:20px;margin:5px 10px}.PlaylistSelection .listPlaylists .panneaudroite .Start{width:100%;font-size:50px}.PlaylistSelection .listPlaylists .panneaudroite .Start:hover{background:#044b00c0}.PlaylistSelection .UserPlaylist{position:fixed;margin:0;width:250px;left:20px;bottom:15px}.UserInfos{position:fixed;right:10px;top:10px;background-color:#f0f0f0;padding:10px;border-radius:8px;box-shadow:0 4px 8px #0000001a;width:280px;margin:10px;display:flex;align-items:center;cursor:pointer}.UserInfos .UserImage{width:60px;height:60px;border-radius:50%;object-fit:cover;margin-right:20px}.UserInfos .UserText{display:flex;flex-direction:column}.UserInfos .UserName{font-size:20px;color:#333;font-weight:700}.UserInfos .info{font-size:14px;color:#666;margin-top:8px}.ListPlaylistCard{display:flex;background:#011f78c0;box-shadow:0 8px 32px #1f26875e;backdrop-filter:blur(10.5px);-webkit-backdrop-filter:blur(10.5px);border-radius:10px;border:1px solid rgba(255,255,255,.18);transition-duration:.2s;color:#fff;font-family:-apple-system,BlinkMacSystemFont,sans-serif;font-size:35px;font-weight:700;scrollbar-width:none;justify-content:center;align-items:center;width:100%;height:50px;margin-bottom:20px;cursor:pointer}.ListPlaylistCard:hover{background:#00134bc0}.PlaylistCard:hover{transform:scale(1.05);transition:transform .1s ease-in-out}.Dialog .SplitDialogue{display:flex;justify-content:space-around}.Dialog .SplitDialogue .DialogueChoixGauche{display:flex;flex-direction:column;width:45%}.Dialog .SplitDialogue button{background:#001a67;box-shadow:0 8px 32px #1f26875e;backdrop-filter:blur(10.5px);-webkit-backdrop-filter:blur(10.5px);border-radius:10px;border:1px solid rgba(255,255,255,.18);color:#fff;font-size:25px;padding:20px;margin:20px}.Dialog{width:90%;margin:auto}.Dialog .DialogTitle{font-size:35px;text-align:center;font-weight:700}.Dialog .DialogTitle input{width:100%}.Dialog .DialogTitle button{padding:10px 20px;color:#000;margin:10px 0;font-size:20px}.VisuelQuestion{display:grid;grid-template-columns:1fr 1fr}.VisuelQuestion .PochetteAlbum{width:450px;height:450px;border-radius:10px;box-shadow:0 0 10px #000;margin-left:auto;margin-right:20px}.VisuelQuestion .infos{width:100%;margin-left:20px;display:flex;flex-direction:column}.VisuelQuestion .infos .TitrePlaylist{font-size:2.7rem;font-weight:700;color:#fff;margin-top:0}.VisuelQuestion .infos button{margin-top:20px;width:230px;height:50px;margin-right:30px;color:#fff;font-size:1.5rem;font-weight:700;border:none;cursor:pointer}.content{display:flex;flex-direction:column;margin-top:130px}.Question-Answered{display:flex;flex-direction:row;margin-top:auto}.Response{margin-top:auto}.header{display:flex;position:fixed;justify-content:space-between;width:100%;transform:translateY(35px);z-index:1}.header button{padding:10px 20px;margin:0 40px;font-size:1.2rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.Chargement{display:flex;align-items:center;margin:auto 30px}.Roue{border-top:6px solid #000;border-radius:50%;width:300px;height:300px;animation:spin 1s linear infinite}.Loading{font-size:2rem;color:#000;transform:translate(-125%)}.countdown{display:flex;align-items:center;justify-content:center;margin:auto 30px;position:relative;width:320px;height:320px}.countdown .circle-container{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.countdown .circle-container .timeLeft{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;font-size:3rem;z-index:1}.countdown .circle-container svg{position:relative;z-index:0}.ModeJeu{padding:20px;background-color:#f0f0f0;border-radius:8px;box-shadow:0 4px 6px #0000001a;font-family:Arial,sans-serif;margin:20px 0}.ModeJeu select{margin-left:10px;padding:8px 12px;border-radius:4px;border:1px solid #ccc;box-shadow:inset 0 1px 3px #0000001a;cursor:pointer}.ModeJeu select:focus{outline:none;border-color:#007bff}.ModeJeu div{margin-top:15px;padding:10px;background-color:#fff;border-left:3px solid #007bff;font-size:.9rem;line-height:1.4}.secondaires{font-family:-apple-system,BlinkMacSystemFont,sans-serif;color:#fffc;font-size:30px;text-shadow:1px 1px 5px rgba(31,38,135,.37);letter-spacing:1px;overflow:hidden;width:100%;transition:2s}.primaires{font-family:-apple-system,BlinkMacSystemFont,sans-serif;color:#fff;font-size:35px;font-weight:bolder;text-shadow:1px 1px 5px rgba(31,38,135,.37);letter-spacing:2px;overflow:hidden;width:100%;transition:2s}.paroles{font-size:2em;background:#ffffff26;box-shadow:0 8px 32px #1f26875e;backdrop-filter:blur(10.5px);-webkit-backdrop-filter:blur(10.5px);border-radius:10px;border:1px solid rgba(255,255,255,.18);padding:20px;margin-right:20px}.PLP{display:grid;grid-template-columns:1fr 2fr;margin:0 40px}.MuiDialog-paperScrollPaper{max-width:none!important}.Dialog2{width:55%;max-width:800px;margin:auto;padding:20px}.Dialog2 .DialogTitle{font-size:32px;text-align:center;font-weight:700;margin-bottom:10px}.Dialog2 .SplitDialogue{display:flex;justify-content:center;margin-top:20px}.Dialog2 .SplitDialogue .DialogueChoixGauche{width:100%;max-height:250px;overflow-y:auto;background:#f9f9f9;padding:15px;border-radius:10px;box-shadow:inset 0 0 5px #0000001a}.Dialog2 .SplitDialogue .DialogueChoixGauche h2{font-size:20px;font-weight:700;margin-bottom:10px}.Dialog2 .SplitDialogue .DialogueChoixGauche ul{padding-left:20px;font-size:16px}.Dialog2 .SplitDialogue .DialogueChoixGauche li{margin-bottom:6px}.Dialog2 button{background:#001a67;box-shadow:0 8px 32px #1f26875e;backdrop-filter:blur(10.5px);-webkit-backdrop-filter:blur(10.5px);border-radius:10px;border:1px solid rgba(255,255,255,.18);color:#fff;font-size:18px;padding:10px 20px;margin:20px}.MuiAlert-root{font-size:20px!important;font-weight:700!important}.alert{position:fixed;left:50%;bottom:20px;transform:translate(-50%);z-index:1000}.App{display:flex;flex-direction:row;justify-content:center}.description{margin-top:100px;font-size:20px;text-align:justify;width:70%;overflow:auto}.description img{width:110px}.logosmusique{display:flex;justify-content:space-between;width:50%;margin:0 auto;cursor:pointer}