body{font-family:'Roboto',sans-serif;background-color:#f5f5f5;margin:0;display:flex;justify-content:center;align-items:center;overflow:show;}a{color:#00a9ec;text-decoration:none;}a:hover{color:#004997;transition:color .3s ease;}.navbar{}.navbar .container{display:flex;align-items:center;background-color:007bff}.navbar .dropdown{position:relative;display:inline-block;}.navbar .dropbtn{cursor:pointer;}.navbar .dropdown-content{display:none;position:absolute;background-color:#f9f9f9;min-width:160px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;border-radius:5px;}.navbar .dropdown-content a{color:black;padding:12px 12px;text-decoration:none;display:block;}.navbar .dropdown:hover .dropdown-content{display:block;}.navbar .logo a{text-decoration:none;font-size:24px;;}@media only screen and (max-width:480px){.navbar .logo a{font-size:20px}.navbar .nav-links li{margin-left:15px;margin-top:10px}.container{max-width:90%}h1{font-size:24px}.custom-file-upload{padding:8px 12px}input[type="number"]{width:50px}button{padding:12px 16px}#gifOutput{max-height:400px}}.navbar .logo a:hover{background-color:#000000;text-decoration:none;font-size:24px;;}.navbar .nav-links{list-style:none;margin:0;padding:5px;display:flex;}.navbar .nav-links li{margin-left:20px;margin-top:20px;}.navbar .nav-links a{color:#000000;text-decoration:none}.navbar .nav-links a:hover{color:#007bff;border-radius:5px;transition:color .3s ease;}.container{background:#ffffff;box-shadow:0 4px 8px rgba(0,0,0,.1);padding:20px;border-radius:2px;text-align:center;max-width:875px;width:100%;display:flex;flex-direction:column;margin:0 auto 5px auto;letter-spacing:.7px;}.x{flex-direction:column;display:flex;max-height:100%;}ol,ul{text-align:left;}h1{margin-bottom:20px;font-weight:500;color:#333;}#conversion-section{margin-bottom:20px;}.upload-section{margin-bottom:20px;}.custom-file-upload{display:inline-block;padding:13px 20px;cursor:pointer;font-size:18px;background:#00b7ff;color:#ffffff;border-radius:2px;margin-bottom:10px;transition:background .3s;}.custom-file-upload:hover{background:#007bff;}input[type="file"]{display:none;}.frame-rate-section{display:flex;justify-content:center;align-items:center;margin-bottom:20px;}.frame-rate-section label{margin-right:10px;color:#555;}input[type="number"]{width:60px;padding:5px;border:1px solid #ccc;border-radius:4px;}button{background:#5dc71f;color:#ffffff;margin-top:20px;padding:20px 30px;font-size:18px;border:none;border-radius:2px;cursor:pointer;transition:background .3s;}button:hover{background:#41af01;}#progressContainer{width:100%;background-color:#ddd;border-radius:4px;overflow:hidden;margin-bottom:20px;margin-top:20px;}#progressBar{width:0;height:30px;background-color:#4caf50;text-align:center;line-height:30px;color:white;}#gifOutput{max-width:800px;border-radius:4px;display:none;margin-top:20px;max-height:600px;}video,canvas{display:none;}.tooltip{position:relative;display:inline-block;cursor:pointer;padding-left:10px;}.tooltip .tooltiptext{visibility:hidden;width:250px;background-color:#555;color:#fff;text-align:center;border-radius:5px;padding:5px;position:absolute;z-index:1;bottom:125%;left:50%;margin-left:-125px;opacity:0;transition:opacity .3s;}.tooltip:hover .tooltiptext{visibility:visible;opacity:1;}#how-to-convert,#faq,#guides-tutorials{background-color:#f9f9f9;padding:20px;margin-bottom:20px;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1);}#how-to-convert{background-color:#eaf4f4;}#faq{background-color:#fef5e4;}#guides-tutorials{background-color:#e4eaf4;}