#intro{height:100%;width:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;margin-top:-120px;gap:50px}@media only screen and (min-width: 768px){#intro{width:50%;margin-top:0;display:flex;flex-direction:column;justify-content:center;align-items:center}}#intro .container{width:90%;display:flex;flex-direction:column;justify-content:center;align-items:start;gap:20px}#intro .container h2{font-size:2.4rem;font-weight:bolder;background:linear-gradient(45deg,#f21717,#a7135f,#0ff);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}@media only screen and (min-width: 768px){#intro .container h2{font-size:3.2rem}}#intro .container p{width:80%;font-size:1.3rem;color:#ffffff91}#intro #buttons{width:80%;gap:30px;display:flex;justify-content:space-between}@media only screen and (min-width: 768px){#intro #buttons{width:60%}}#intro #buttons button{--color: #560bad;font-family:inherit;display:inline-block;width:8em;height:2.6em;line-height:2.5em;margin:10px;position:relative;cursor:pointer;overflow:hidden;border:2px solid var(--color);transition:color .5s;z-index:1;font-size:17px;border-radius:6px;font-weight:500;color:var(--color);background:transparent}#intro #buttons button:before{color:#fff;content:"";position:absolute;z-index:-1;background:var(--color);height:150px;width:200px;border-radius:50%}#intro #buttons button:hover{color:#fff}#intro #buttons button:before{top:100%;left:100%;transition:all .7s}#intro #buttons button:hover:before{top:-30px;left:-30px}#intro #buttons button:active:before{background:#3a0ca3;transition:background 0s}.form-container{height:100vh;width:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;box-sizing:border-box;gap:40px}.form-container form{width:70%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:40px}.form-container form input{width:60%;padding:13px;color:#fff;border:none;background:transparent}.form-container button{--color: #560bad;font-family:inherit;display:inline-block;width:8em;height:2.6em;line-height:2.5em;position:relative;cursor:pointer;overflow:hidden;border:2px solid var(--color);transition:color .5s;z-index:1;font-size:15px;border-radius:6px;font-weight:500;color:var(--color);background:transparent;margin-left:30px}@media only screen and (min-width: 768px){.form-container button{margin:0 40px 0 60px}}.form-container{height:100vh;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;box-sizing:border-box;gap:40px}@media only screen and (min-width: 768px){.form-container{width:50%}}.form-container form{width:70%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:50px}.form-container form input{width:60%;padding:13px;border:none;background:transparent;color:#fff}.form-container form input::placeholder{color:#ffffff7c}.form-container form input:hover{border-bottom:.9px solid black}.form-container form input:focus{border-bottom:2px solid black;outline:none;color:#fff}.form-container button{--color: #560bad;font-family:inherit;display:inline-block;width:8em;height:2.6em;line-height:2.5em;position:relative;cursor:pointer;overflow:hidden;border:2px solid var(--color);transition:color .5s;z-index:1;font-size:15px;border-radius:6px;font-weight:500;color:var(--color);background:transparent}.form-container button:before{color:#fff;content:"";position:absolute;z-index:-1;background:var(--color);height:150px;width:200px;border-radius:50%}.form-container button:hover{color:#fff}.form-container button:before{top:100%;left:100%;transition:all .7s}.form-container button:hover:before{top:-30px;left:-30px}.form-container button:active:before{background:#3a0ca3;transition:background 0s}.content{box-sizing:border-box;height:100vh;width:100%;color:#fff;background-image:url(/assets/Intro-CxpkMr5Y.gif);background-position:center;background-repeat:no-repeat;background-size:cover}.content .overlay{position:absolute;bottom:0;left:0;height:100%;width:100%;background:linear-gradient(to top right,#000,#0000)}#nav-route{display:flex;justify-content:space-evenly}#nav-route .nav{height:100vh;width:20%;font-family:sans-serif;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;left:0;transition:left .2s ease-in-out}@media only screen and (min-width: 768px){#nav-route .nav{width:15%;display:flex;flex-direction:column;justify-content:center;align-items:center}}#nav-route .nav #logo{height:10%;width:98%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;animation:logo 1s ease;gap:10px}@media only screen and (min-width: 768px){#nav-route .nav #logo{height:20%;width:98%;display:flex;flex-direction:row;justify-content:flex-start;align-items:center}}#nav-route .nav #logo img{height:50px;width:50px}@media only screen and (min-width: 768px){#nav-route .nav #logo img{height:70px;width:70px}}#nav-route .nav #logo p{font-size:.6rem;font-weight:700;position:relative;animation-delay:.2s;animation:logotext 2s ease-in-out}@media only screen and (min-width: 768px){#nav-route .nav #logo p{font-size:1rem}}@keyframes logotext{0%{transform:scale(0)}80%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes logo{0%{left:-80px;bottom:-20px}to{left:0;bottom:0}}#nav-route .nav #content{height:90%;width:100%;display:flex;flex-direction:row;justify-content:center;align-items:flex-start}@media only screen and (min-width: 768px){#nav-route .nav #content{height:80%;width:100%}}#nav-route .nav #content ul{height:50%;width:82%;display:flex;flex-direction:column;justify-content:center;align-items:center;animation:tags 1s ease;position:relative;gap:80px}@media only screen and (min-width: 768px){#nav-route .nav #content ul{margin-top:30px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:30px}}#nav-route .nav #content ul .link{font-size:.8rem;color:#000;font-weight:700;text-decoration:none;transform:rotate(-90deg);transition:letter-spacing .3s ease-in-out}@media only screen and (min-width: 768px){#nav-route .nav #content ul .link{font-size:1.2rem;transform:none}}#nav-route .nav #content ul .link:hover{letter-spacing:2px}@keyframes tags{0%{left:-80px}to{left:0}}#nav-route .nav #content #toogle{height:100%;display:flex;justify-content:center;align-items:center;position:relative}#nav-route .nav #content #toogle .btn{height:80px;position:absolute;font-size:.5rem;font-weight:700;font-family:Gill Sans,Gill Sans MT,Calibri,Trebuchet MS,sans-serif;display:flex;flex-direction:column;justify-content:center;align-items:center;border:none;cursor:pointer;gap:12px;border-radius:0 30px 30px 0;animation:btn 2s ease-in-out}@media only screen and (min-width: 768px){#nav-route .nav #content #toogle .btn{height:110px;font-size:.8rem}}@keyframes btn{0%{transform:scale(0)}80%{transform:scale(1.2)}to{transform:scale(1)}}#nav-route .nav #content #toogle .btn span{transform:rotate(90deg);display:inline-block;margin-top:8px}#nav-route .nav #content #toogle #open-btn{visibility:hidden}#nav-route .navbar{left:-63px}@media only screen and (min-width: 768px){#nav-route .navbar{left:-168px}}#nav-route .navbar #content #toogle #open-btn{visibility:visible;margin-left:18px}#nav-route .navbar #content ul{width:100%}@media only screen and (min-width: 768px){#nav-route .navbar #content ul{width:90%}}#nav-route .navbar #close-btn{visibility:hidden}#nav-route #routes{width:85%}#dashboard{height:100vh;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Cambria,Cochin,Georgia,Times,Times New Roman,serif}#dashboard #banner{height:30vh;width:100%;display:flex;justify-content:center;align-items:center}#dashboard #banner #bnr-content{height:100px;width:70%;padding:10px;border-radius:10px;display:flex;align-items:center;justify-content:space-between;background:#0bc289;background:-webkit-linear-gradient(0deg,#0bc289 0%,#00b68f 50%,#26e6a0 100%);background:linear-gradient(0deg,#0bc289,#00b68f,#26e6a0)}#dashboard #banner #bnr-content #bnr-text{display:flex;flex-direction:column;gap:10px}#dashboard #banner #bnr-content #bnr-text h2{font-size:1.5rem;color:#f0f0f0}#dashboard #banner #bnr-content #bnr-text h4{color:#f0f0f0d5;width:73%;font-size:.8em}#dashboard #banner #bnr-content img{height:150px;width:180px;position:relative;top:-14px}#dashboard #content{height:70vh;width:100%}#dashboard #content h3{font-size:.9rem;color:#000000ae;margin-left:20px}#dashboard #content #overview{height:30vh;width:100%;display:flex;justify-content:space-evenly;align-items:center}#dashboard #content #overview .ov{height:100px;width:350px;color:#f0f0f0;border-radius:10px;background-color:#0d2b5e;display:flex;justify-content:space-evenly;align-items:center}#dashboard #content #overview .ov img{height:40px;width:40px;padding:30px}#dashboard #content #overview .ov .text{height:auto;display:flex;flex-direction:column;width:80%;gap:20px}#dashboard #content #overview .ov .text .count{font-size:1.3rem;text-align:center}#dashboard #content #overview .ov .text p{width:80%;font-size:.7rem;text-align:center}#dashboard #content #milestones{height:auto;width:90%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px;gap:15px}#dashboard #content #milestones .mile{height:90px;width:70%;padding:10px;display:flex;justify-content:flex-start;align-items:center;border-radius:10px;background-color:#0a2655}#dashboard #content #milestones .mile .img{width:33%;display:flex;justify-content:center;align-items:center}#dashboard #content #milestones .mile .img img{height:90px;width:90px;display:flex;justify-content:center;align-content:center}#dashboard #content #milestones .mile .description{font-size:.8rem;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:10px;color:#fff}#dashboard #content #milestones .mile .description h2{font-size:.9rem}#dashboard #content #milestones .mile .description p{font-size:.7rem;color:#ffffff97}#dashboard #content #milestones .mile .description strong{font-size:.7rem;font-weight:bolder;color:#00e1ff}#Projects{height:100vh;width:100%;display:flex;flex-direction:column;align-items:center;box-shadow:0 0 .8px}#Projects #search{height:100px;width:100%;display:flex;justify-content:center;align-items:center}#Projects #search input{padding:10px;border:1px solid black;border-radius:30px;width:200px;transition:all .2s ease-in-out}#Projects #search input:focus{outline:none;width:240px}#Projects #add-projects{height:50px;width:99%;padding:5px;display:flex;justify-content:flex-end;align-items:center;box-shadow:0 0 .8px}#Projects #add-projects #add{height:30px;font-size:.7rem;padding:5px;font-weight:700;color:#fff;border:none;border-radius:5px;cursor:pointer;background-color:#00f;transition:all .2s ease-in-out}#Projects #add-projects #add:hover{background:#0056b3;transform:scale(1.09)}#Projects #content{height:80vh;width:100%;overflow:none;display:flex;justify-content:center;align-items:center;overflow:hidden}#Projects #content #cards{height:100%;width:100%;display:grid;grid-template-columns:auto auto auto;scroll-behavior:smooth;justify-content:space-evenly;align-items:center;margin-top:30px;padding:10px;overflow-y:scroll;scrollbar-width:none;gap:30px}#Projects #content #cards .card{height:130px;width:250px;padding:10px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;border-radius:10px;transition:all .2s ease-in-out;background-color:#165e56cb}#Projects #content #cards .card:hover{box-shadow:15px 14px 30px #000;transform:scale(1.01)}#Projects #content #cards .card #text-info h1{font-size:1.5rem;padding:5px;color:#fff}#Projects #content #cards .card #text-info p{padding:5px;color:#ffffffb3;font-size:1rem}#Projects #content #cards .card #manager{height:40px;width:100%;display:flex;justify-content:flex-end;align-items:center;gap:40px}#Projects #content #cards .card #manager img{height:18px;width:18px;cursor:pointer;padding:8px;border-radius:50%;transition:all .2s ease-in-out}#Projects #content #cards .card #manager img:hover{transform:scale(1.2);background-color:#08383b4b}#Projects #content #cards .card #manager #view-task{height:30px;width:80px;padding:2px;border:none;color:#fff;cursor:pointer;border-radius:5px;font-weight:700;background-color:#00f;transition:all .2s ease-in-out}#Projects #content #cards .card #manager #view-task:hover{background:#0056b3;transform:scale(1.09)}#Projects .modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}#Projects .modal{background:#fff;padding:20px;border-radius:8px;width:400px;box-shadow:0 5px 15px #0000004d;position:relative;display:flex;flex-direction:column;align-items:center}#Projects h2{color:#000000f0;font-size:1.5rem;margin-bottom:20px}#Projects .close-btn{position:absolute;top:10px;right:10px;background:transparent;border:none;font-size:1.5rem;cursor:pointer}#Projects .form-group{width:100%;margin-bottom:15px}#Projects .form-group label{font-size:.8rem;display:block;margin-bottom:5px;font-weight:700}#Projects .form-group input,#Projects .form-group textarea{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px;font-size:1rem}#Projects .form-group input:focus,#Projects .form-group textarea:focus{font-family:Times New Roman,Times,serif;outline:none;border-color:#00f;color:#000;font-weight:400}#Projects button{padding:10px 15px;background:#007bff;color:#050505;border:none;border-radius:4px;cursor:pointer;font-weight:700;transition:all .2s ease-in-out}#Projects button:hover{background:#0056b3;transform:scale(1.09)}#tasks{height:100vh;width:100%;display:flex;flex-direction:column;align-items:center;box-shadow:0 0 .8px}#tasks #search{height:100px;width:100%;display:flex;justify-content:center;align-items:center}#tasks #search input{padding:10px;border:1px solid black;border-radius:30px;width:200px;transition:all .2s ease-in-out}#tasks #search input:focus{outline:none;width:240px}#tasks #add-projects{height:50px;width:99%;padding:5px;display:flex;justify-content:flex-end;align-items:center;box-shadow:0 0 .8px}#tasks #add-projects #add{height:30px;font-size:.7rem;padding:5px;font-weight:700;color:#fff;border:none;border-radius:5px;cursor:pointer;background-color:#00f}#tasks #add-projects #add:hover{background:#0056b3}#tasks #content{height:80vh;width:100%;overflow:none;display:flex;justify-content:center;align-items:center;overflow:hidden}#tasks #content #cards{height:100%;width:100%;display:grid;grid-template-columns:auto auto auto;scroll-behavior:smooth;justify-content:space-evenly;align-items:center;margin-top:30px;padding:10px;overflow-y:scroll;scrollbar-width:none;gap:30px}#tasks #content #cards .card{height:130px;width:250px;padding:10px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;border-radius:10px;transition:all .2s ease-in-out;background-color:#165e56cb}#tasks #content #cards .card:hover{box-shadow:15px 14px 30px #000;transform:scale(1.01)}#tasks #content #cards .card #text-info h1{font-size:1.5rem;padding:5px;color:#fff}#tasks #content #cards .card #text-info p{padding:5px;color:#ffffffb3;font-size:1rem}#tasks #content #cards .card #manager{height:40px;width:100%;display:flex;justify-content:flex-end;align-items:center;gap:35px}#tasks #content #cards .card #manager p{font-size:.9rem}#tasks #content #cards .card #manager img{height:18px;width:18px;cursor:pointer;padding:8px;border-radius:50%;transition:all .2s ease-in-out}#tasks #content #cards .card #manager img:hover{transform:scale(1.2);background-color:#08383b4b}#tasks .modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}#tasks .modal{background:#fff;padding:20px;border-radius:8px;width:400px;box-shadow:0 5px 15px #0000004d;position:relative;display:flex;flex-direction:column;align-items:center}#tasks h2{color:#000000f0;font-size:1.5rem;margin-bottom:20px}#tasks .close-btn{position:absolute;top:10px;right:10px;background:transparent;border:none;font-size:1.5rem;cursor:pointer}#tasks .form-group{width:100%;margin-bottom:15px}#tasks .form-group label{font-size:.8rem;display:block;margin-bottom:5px;font-weight:700}#tasks .form-group input,#tasks .form-group textarea{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px;font-size:1rem}#tasks .form-group input:focus,#tasks .form-group textarea:focus{font-family:Times New Roman,Times,serif;outline:none;border-color:#00f;color:#000;font-weight:400}#tasks button{padding:10px 15px;background:#007bff;color:#050505;border:none;border-radius:4px;cursor:pointer;font-weight:700}#tasks button:hover{background:#0056b3}#setting{height:80vh;width:100%;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding-top:20px;gap:20px}#setting .container{width:80%;display:flex;flex-direction:column;gap:10px;padding:15px;margin-bottom:20px;border:1px solid #ddd;border-radius:8px;transition:all .3s ease}#setting .container span{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}#setting .container span p{font-size:16px;font-weight:600;color:#333;margin:0}#setting .container span button{background-color:#0bc289;color:#fff;border:none;border-radius:5px;padding:5px 10px;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .3s ease}#setting .container span button:hover{background-color:#00a076}#setting .container input{border:1px solid #ccc;border-radius:5px;padding:8px;font-size:14px;outline:none;transition:border-color .3s ease}#setting .container input:focus{border-color:#0bc289}#setting .Btn{display:flex;align-items:center;justify-content:flex-start;width:50px;height:50px;border:none;border-radius:50%;cursor:pointer;position:relative;overflow:hidden;transition-duration:.4s;box-shadow:2px 2px 10px #0003;background:linear-gradient(to right,#3498db,#e74c3c)}#setting .sign{width:100%;transition-duration:.4s;display:flex;align-items:center;justify-content:center}#setting .sign svg{width:17px}#setting .sign svg path{fill:#fff}#setting .text{position:absolute;right:0%;width:0%;opacity:0;color:#ecf0f1;font-size:1.2em;font-weight:600;transition-duration:.4s}#setting .Btn:hover{width:150px;border-radius:20px;transition-duration:.4s;background:linear-gradient(to right,#3498db,#e74c3c)}#setting .Btn:hover .sign{width:30%;transition-duration:.4s;padding-left:12px}#setting .Btn:hover .text{opacity:1;width:70%;transition-duration:.4s;padding-right:10px}#setting .Btn:active{transform:translate(2px,2px);box-shadow:0 0 #0003}
