.navbar{background-color:#2e2e2e;padding:1rem;display:flex;justify-content:center;position:fixed;width:100%;z-index:1}.navbar ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;text-shadow:0 0 10px #58a6ff,0 0 20px #58a6ff,0 0 30px #58a6ff}.navbar ul li{margin-right:1rem}.navbar ul li a{text-decoration:none;color:#b3ffa4}.navbar ul li a:hover{text-decoration:underline}footer{text-align:center;padding:10px;background-color:#161b22;border-top:2px solid #58a6ff;color:#8b949e;height:60px}header{text-align:center;padding:20px;background-color:#161b22;border-bottom:2px solid #58a6ff}main h1{font-size:3rem;color:#58a6ff;text-shadow:0 0 10px #58a6ff,0 0 20px #58a6ff,0 0 30px #58a6ff}header p{font-size:1.2rem;color:#8b949e}main{padding:20px;display:flex;flex-direction:column;align-items:center;text-align:center}section{margin:20px 0;text-align:center}section h2{font-size:2rem;color:#58a6ff}ul{list-style-type:none;padding:0}ul li{background-color:#21262d;margin:5px 0;padding:10px;border:1px solid #58a6ff;border-radius:5px}button{margin-top:20px;padding:10px 20px;font-size:1rem;color:#0d1117;background-color:#58a6ff;border:none;border-radius:5px;cursor:pointer;transition:transform .3s,background-color .3s}button:hover{transform:scale(1.1);background-color:#1f6feb}.history-container{padding:20px;font-family:Arial,sans-serif;width:85%}.history-container header h1{text-align:center;margin-bottom:20px}.history-container .histoire{padding:20px;border-radius:5px;margin-bottom:20px;text-align:left}.history-container .histoire h2{font-size:1.5em;margin-bottom:10px}.history-container .histoire h3{font-size:1.2em;color:#58a6ff}.history-container .histoire h4{font-size:1.1em;margin-top:15px}.history-container .histoire p{line-height:1.6}.history-container .NavBtn{display:flex;justify-content:space-between}.history-container .NavBtn button:disabled{opacity:.5;cursor:not-allowed}.customBtn{margin-top:20px;padding:10px 20px;font-size:1rem;color:#0d1117;background-color:#58a6ff;border:none;border-radius:5px;cursor:pointer;transition:transform .3s,background-color .3s;display:flex;justify-content:center;align-items:center}.customBtn:hover{transform:scale(1.1);background-color:#1f6feb}.customBtn:disabled{background-color:#8b949e;cursor:not-allowed;transform:none}.base-container{padding:20px;font-family:Arial,sans-serif;width:85%}.base-container header h1{text-align:center;margin-bottom:20px}.base-container .base{padding:20px;border-radius:5px;margin-bottom:20px;text-align:left}.base-container .base h2{font-size:1.5em;margin-bottom:10px}.base-container .base h3{font-size:1.2em;color:#58a6ff}.base-container .base h4{font-size:1.1em;margin-top:15px}.base-container .base p{line-height:1.6}.base-container .NavBasesBtn{display:flex;align-items:center;justify-content:space-around}.base-container .NavBasesBtn button:disabled{opacity:.5;cursor:not-allowed}.instructions-container{padding:20px;font-family:Arial,sans-serif;width:85%}.instructions-container header h1{text-align:center;margin-bottom:20px}.instructions-container .instructions{padding:20px;border-radius:5px;margin-bottom:20px;text-align:left}.instructions-container .instructions h2{font-size:1.5em;margin-bottom:10px}.instructions-container .instructions h3{font-size:1.2em;color:#58a6ff}.instructions-container .instructions h4{font-size:1.1em;margin-top:15px}.instructions-container .instructions p{line-height:1.6}.instructions-container .NavInstructionssBtn{display:flex;align-items:center;justify-content:space-around}.instructions-container .NavInstructionssBtn button:disabled{opacity:.5;cursor:not-allowed}.logiciels-container{padding:20px;background-color:#282c34}.logiciels-container header{text-align:center;margin-bottom:20px}.logiciels-container header h2{font-size:1.5em;margin-bottom:10px}.logiciels-container header h3{font-size:1.2em;color:#58a6ff}.logiciels-container header h4{font-size:1.1em;margin-top:15px}.logiciels-container header p{line-height:1.6}.logiciels-container .logiciels-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.logiciels-container .logiciels-list .logiciel-card{background:#21262d;padding:20px;border:1px solid #ddd;border-radius:8px;box-shadow:0 2px 4px #0000001a;text-align:center}.logiciels-container .logiciels-list .logiciel-card h2{font-size:1.5rem;color:#58a6ff;margin-bottom:10px}.logiciels-container .logiciels-list .logiciel-card p{font-size:1rem;color:#666;margin-bottom:20px}.logiciels-container .logiciels-list .logiciel-card .download-btn{background-color:#007bff;color:#fff;border:none;padding:10px 20px;border-radius:5px;cursor:pointer;text-decoration:none;position:relative}.logiciels-container .logiciels-list .logiciel-card .download-btn:hover{background-color:#0056b3}.tutorials-container{padding:20px;font-family:Arial,sans-serif;width:85%}.tutorials-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-top:20px}.tutorial-card{background:#21262d;border:1px solid #ddd;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px #0000001a;transition:transform .3s ease}.tutorial-card:hover{transform:translateY(-10px)}.tutorial-image{width:100%;height:200px;object-fit:cover}.tutorial-info{padding:16px}.tutorial-info h3{font-size:1.2em;margin-bottom:10px;color:#58a6ff}.tutorial-info p{font-size:1em;margin-bottom:15px;color:#666}.view-btn{background-color:#007bff;color:#fff;padding:8px 16px;border:none;border-radius:4px;cursor:pointer;text-decoration:none}.view-btn:hover{background-color:#0056b3}.NavTutorialsBtn{margin-top:20px;display:flex;justify-content:space-between}html,body{font-family:Courier New,Courier,monospace;margin:0;padding:0;background-color:#282c34;color:#c9d1d9;height:100%;display:flex;flex-direction:column}a{text-decoration:none}.app-wrapper{display:flex;flex-direction:column;min-height:100vh}.app-container{flex:1;position:relative;margin:6rem 0 0;display:flex;flex-direction:column;align-items:center;gap:1rem}.tutorial-details-container{padding:20px;font-family:Arial,sans-serif;width:85%}.tutorial-details-container header{text-align:center;margin-bottom:20px}.tutorial-details-container header h1{font-size:2.5rem;margin-bottom:.5rem}.tutorial-details-container header p{line-height:1.6;color:#666}.tutorial-details-container .tutorial-content{display:flex;flex-direction:column;gap:2rem}.tutorial-details-container .tutorial-content .code-example{background-color:#1e1e1e;padding:1.5rem;border-radius:8px;box-shadow:0 4px 6px #0000001a}.tutorial-details-container .tutorial-content .code-example h3{font-size:1.5rem;color:#fff;margin-bottom:1rem}.tutorial-details-container .tutorial-content .code-example pre{margin:0;overflow-x:auto}.tutorial-details-container .exercise-button{display:inline-block;align-self:center;background-color:#007bff;color:#fff;padding:.75rem 1.5rem;font-size:1rem;font-weight:700;border:none;border-radius:5px;cursor:pointer;text-transform:uppercase;transition:background-color .3s ease}.tutorial-details-container .exercise-button:hover{background-color:#0056b3}.tutorial-details-container .exercise-button:active{background-color:#00408d}.exercise-section{margin-top:20px}.exercise-section .exercise-content{margin-top:15px;padding:15px;border:1px solid #ccc;border-radius:5px;background-color:#f9f9f9}.exercise-section h3{margin-bottom:10px}
