body{all:unset;color:var(--black);font-family:Montserrat,sans-serif;font-size:24px;font-weight:600;line-height:1.5;overflow-x:hidden}*{box-sizing:border-box;margin:0;padding:0}a{color:inherit;text-decoration:none}.btn{border:var(--btn-border);color:var(--black);padding:var(--btn-padding);height:var(--btn-height);border-radius:var(--btn-radius);font-size:var(--btn-font-size);cursor:pointer}.btn:hover{background-color:var(--black);color:var(--white);transition:all .4s}.btn.white{border-color:var(--white);color:var(--white)}.hello{color:red}h1{color:var(--coral);margin:30px auto;font-family:Noto Serif,serif;font-size:43px;font-weight:500;transition:font-size .4s,font-weight .4s,color .4s}section{margin-bottom:100px}.square{width:calc(var(--btn-height)*12);height:calc(var(--btn-height)*9);border-radius:var(--btn-radius);border:var(--btn-border);border-color:var(--coral);color:var(--coral);padding:var(--btn-height);flex-direction:column;justify-content:space-between;align-items:center;padding-top:86px;font-size:30px;transition:all 2s;display:flex}.square.full{background-color:var(--coral);color:var(--white)}section:has(div.square)>div{justify-content:center;gap:70px;padding:40px;display:flex}.square span{white-space:nowrap;margin-bottom:50px;font-family:Noto Serif,serif;font-size:37px;font-weight:700}.square .btn{border-color:var(--coral);color:var(--coral);margin-top:auto}.square .btn:hover{background-color:var(--coral);color:var(--white)}.square.full .btn{border-color:var(--white);color:var(--white)}.square.full .btn:hover{background-color:var(--white);color:var(--coral)}:root{--background-color:#f5f5f5;--text-color:#333;--coral:#db5349;--gray:#383e42;--black:#000;--white:#f5f5f5;--font-family:"Arial",sans-serif;--btn-height:36px;--btn-radius:25px;--btn-padding:6px 15px;--btn-border:1.5px solid var(--black);--btn-font-size:16px}#root{background:url(https://depositphotos-blog.s3.eu-west-1.amazonaws.com/uploads/2017/07/Soothing-nature-backgrounds-2.webp) 50%/cover;gap:15px;height:100vh;margin:0;padding:15px 15px 15px 0;display:flex}.parent{width:100%;height:100%}.div4,.div5,.div6{background-color:#fbfaf6ab;border-radius:35px;overflow:hidden}.parent{grid-column-gap:15px;grid-row-gap:15px;grid-template-rows:2fr 4fr 3fr 16fr;grid-template-columns:10fr 11fr;display:grid}.div1{grid-area:1/1/2/2;font-size:35px}.div2{grid-area:1/2/2/3;align-items:center;gap:5px;display:flex}.div2 .btn{border-color:var(--coral);color:var(--coral);background-color:#0000}.div2 .btn:hover{background-color:var(--coral);color:#fff}.div3{grid-area:2/1/3/2;overflow:hidden}.div4{grid-area:3/1/5/2;overflow:hidden}.div4 iframe{border:none;width:100%;height:100%}.div5{grid-area:2/2/4/3}.div6{grid-area:4/2/5/3}.milestones{gap:60px;width:fit-content;margin:0 auto;font-size:10px;display:flex;position:relative;overflow:hidden}.milestones:before{content:"";background:var(--coral);z-index:1;border-radius:100px;width:50%;height:7px;margin:0 20px;position:absolute;top:50%;transform:translateY(-50%)}.milestones:after{content:"";background:var(--gray);width:-webkit-fill-available;height:5px;margin:0 20px;position:absolute;top:50%;transform:translateY(-50%)}.milestones div{border:7px solid var(--coral);z-index:2;text-align:center;background:#fbfaf6;border-radius:50%;justify-content:center;align-items:center;width:110px;height:110px;display:flex}header{isolation:isolate;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);color:#fff;background:#db53497a;border-radius:0 25px 25px 0;width:0;padding:0;transition:all .3s;position:relative;box-shadow:inset 0 2px 1px #db5349,inset -1px -1px 1px 1px #db5349}header .logos{justify-content:center;align-items:center;width:100%;margin-bottom:25px;display:flex}header .logos a{background-image:url(/v.svg);background-position:0;background-repeat:no-repeat;background-size:30px;border-right:2px solid #fff;border-radius:0;width:50px;height:30px}header .logos span{background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:50%;width:35px;height:35px;margin-left:18px}header nav{flex-direction:column;gap:15px;display:flex;overflow:hidden}header nav div{cursor:pointer;align-items:center;padding:5px 0 5px 15px;display:flex}header nav div img{object-fit:contain;border-radius:5px;width:30px;height:30px;margin-right:10px}header nav div span{white-space:nowrap;font-size:14px;font-weight:700}header nav div:hover{color:var(--coral);background-color:#fff;border-radius:20px 0 0 20px;box-shadow:15px 0 #fff}header .hide{background-color:var(--coral);color:#2f4f4f;z-index:5;border-radius:0 40px 40px 0;justify-content:right;align-items:center;width:30px;height:40px;padding-right:15px;font-size:18px;transition:all .3s;display:flex;position:absolute;bottom:15px;left:0}header.visible{width:auto;padding:15px}header.visible .hide{background-color:#ffffff80;width:80%}header.visible nav{overflow:visible}.error-notification{background-color:var(--coral);z-index:9999;border:1px solid red;border-radius:8px;max-width:400px;animation:.3s ease-out forwards slideIn;position:fixed;top:20px;right:20px;box-shadow:0 2px 8px #00000026}@keyframes slideIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes slideOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(100%)}}.error-notification.closing{animation:.3s ease-in forwards slideOut}.error-content{justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.error-message{color:#721c24;word-break:break-word;flex:1;font-size:14px;font-weight:500;line-height:1.5}.error-close-btn{color:#721c24;cursor:pointer;background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;padding:0;font-size:18px;font-weight:700;transition:background-color .2s;display:flex}.error-close-btn:hover{background-color:#ff63471a}.error-close-btn:active{background-color:#ff634733}@media (max-width:480px){.error-notification{max-width:none;top:10px;left:10px;right:10px}.error-message{font-size:13px}}.task{gap:10px;width:100%;padding:10px 20px;display:flex;position:relative}.task .task-text{width:-webkit-fill-available}.task input{background-color:#0000;border:none;outline:none;margin:0;padding:0;display:block}.task .title{width:-webkit-fill-available;min-height:25px;padding-top:1px;font-size:15px}.task .title:focus,.task .details:focus{outline:none}.task .details{width:-webkit-fill-available;margin-top:0;padding-left:1px;font-size:12px;font-weight:500;transition:margin-top .2s}.task .done{cursor:pointer;border:2.5px solid #c4c7c5;border-radius:50%;width:22px;height:20px;margin:2.5px}.task .done:hover{background-color:#c4c7c582;background-image:url(/done.svg);background-position:50%;background-size:34px;border:none;width:28px;height:25px;margin:0}.task select{appearance:none;background-color:#0000;border:1px solid #c4c7c5;border-radius:50px;min-width:150px;margin-left:5px;padding:2.5px 7px}.task select:focus{outline:none}.task select option{border-radius:10px}.task select option:checked{color:#d33;background-color:#ffe5e5}.task input[type=date]{appearance:none;background-color:#0000;border:1px solid #c4c7c5;border-radius:50px;padding:1px 7px;display:inline-block}.task .star{background-image:url(/star.svg)}.task .star.full{background-image:url(/starf.svg)}.task input[type=date],.task select,.task .delete{display:none}.task .up{opacity:0;background-image:url(/up.svg);width:20px;height:20px;transition:opacity .2s;position:absolute;bottom:47%;left:0}.task .down{opacity:0;background-image:url(/down.svg);width:20px;height:20px;transition:opacity .2s;position:absolute;top:47%;left:0}.task up:hover,.task down:hover{opacity:1}.task:hover,.task:focus-within{background-color:#f0f0f0}.task:focus-within .details{margin-top:5px}.task:focus-within select{display:inline}.task:focus-within input[type=date]{display:inline-block}.task:focus-within .delete{display:inline}.task:focus-within .up,.task:focus-within .down{opacity:1}.task:hover .delete{display:inline}.task span{cursor:pointer;background-position:50%;background-repeat:no-repeat;background-size:20px;border-radius:50%;width:28px;height:25px;margin:2.5px}.task span:hover{background-color:#c4c7c582}.filled{display:inline!important}.task.complete .done{background-image:url(/done.svg);background-position:50%;background-size:34px;border:none;width:28px;height:25px;margin:0}.task.complete .title{color:#888;text-decoration:line-through}.tasks-container{overflow:hidden auto}.tasks-container .add{color:var(--coral);cursor:pointer;background-image:url(/add.svg);background-position:9px;background-repeat:no-repeat;border-radius:30px;margin:20px 10px 10px;padding:5px 5px 5px 45px;font-size:15px}.tasks-container .add:hover{background-color:#f0f0f0}.uncompleted-tasks{flex-direction:column;display:flex}.completed-tasks p{cursor:pointer;-webkit-user-select:none;user-select:none;margin-top:20px;margin-left:25px;font-size:15px}.project-milestones{font-size:15px;position:relative;overflow:hidden auto}.project-milestones .line{background-color:var(--coral);border-radius:50px;width:5px;height:110%;display:block;position:absolute;top:50%;left:18.5px;transform:translateY(-50%)}.project-milestones .add{background:var(--coral);border-radius:7px;width:fit-content;margin-top:9px;margin-bottom:30px;margin-left:63.5px;padding:3px 13px}.project-milestones>div:first-child .line{transform:translateY(-30%)}.project-milestones>div{align-items:center;gap:10px;padding:8px;display:flex;position:relative}.project-milestones>div>span{color:#666;border-radius:50px;width:25px;height:25px;margin:0 10px;display:block}.project-milestones>div h3{align-items:center;gap:15px;display:flex}.project-milestones>div h3 span{background-color:var(--coral);color:#fff;border-radius:50px;padding:2px 10px;font-size:10px}.project-milestones>div>div{background-color:wheat;border-radius:10px;gap:15px;min-width:70%;max-width:85%;padding:5px 40px 5px 10px;display:flex;position:relative}.project-milestones>div .milestone-date{font-size:10px;font-weight:light;text-align:center;border-right:1px solid #eee;flex-direction:column;align-items:center;padding-right:10px;display:flex}.project-milestones>div .milestone-date span{font-size:15px;font-weight:700}.project-milestones .more{background-image:url(/more.svg);background-position:50%;background-repeat:no-repeat;background-size:30px;width:40px;height:40px;position:absolute;top:50%;right:0;transform:translateY(-50%)}.project-milestones .more .more-options{background-color:#fff;border-radius:10px;display:none;position:absolute;overflow:hidden}.project-milestones .more .more-options a{padding:2px 12px;display:block}.project-milestones .more .more-options a:hover{background-color:#eee}.project-milestones .more:hover .more-options{display:block}.project-milestones form{-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);background:#ffffffb3;border-radius:15px;flex-direction:column;max-width:90%;max-height:90%;padding:50px 30px 30px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.project-milestones form input,.project-milestones form select{border:1px solid #ccc;border-radius:5px;width:100%;margin-bottom:15px;padding:10px;display:block}.project-milestones form button[type=submit]{background-color:var(--coral);color:#fff;cursor:pointer;border:none;border-radius:5px;padding:10px 20px}.project-milestones form button[type=button]{cursor:pointer;background-color:#0000;background-image:url(/close.svg);background-position:50%;background-repeat:no-repeat;background-size:35px;border:none;width:40px;height:40px;margin-left:10px;position:absolute;top:0;right:0}.project-users{gap:15px;padding:20px;font-size:15px;display:flex}.project-users .project-user img{object-fit:cover;border-radius:50%;width:40px;height:40px}.project-users .project-user{background-color:var(--coral);border-radius:50px;align-items:center;gap:15px;width:fit-content;height:fit-content;margin-bottom:15px;padding:3px 30px 3px 3px;display:flex}.project-users .add-user{background-color:var(--coral);opacity:.5;cursor:pointer;border-radius:50px;align-items:center;gap:10px;width:fit-content;height:fit-content;margin-bottom:15px;padding:3px 20px 3px 3px;font-size:13px;display:flex}.project-users .add-user img{border-radius:50%;width:25px;height:25px}main{grid-column-gap:15px;grid-row-gap:15px;grid-template-rows:2fr 4fr;grid-template-columns:10fr 11fr;width:100%;height:100%;display:grid}main>*{isolation:isolate;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#ffffff8a;border-radius:35px;inset:0;overflow:hidden;box-shadow:inset 2px 2px 1px #ffffff80,inset -1px -1px 1px 1px #ffffff80}main .tasks-container{grid-area:1/2/3/2}main .project-tools{border:none;grid-area:2/1/3/1;width:100%;height:100%}main .info{padding:15px;font-size:20px}main .info h2{color:var(--coral);margin-bottom:2px}main .info h2 span{background-color:var(--coral);color:#fff;border-radius:15px;margin-left:5px;padding:2px 5px;font-size:10px}main .info p{margin-bottom:10px}main .info button{background-color:var(--coral);color:#fff;cursor:pointer;border:none;border-radius:5px;margin:5px;padding:8px 15px;font-size:14px}main .info button:hover{background-color:#ff7f50cc}main .updateProject{flex-direction:column;gap:15px;padding:20px;display:flex}main .updateProject input,main .updateProject textarea,main .updateProject select{border:1px solid #ccc;border-radius:5px;padding:10px;font-size:16px}main .updateProject textarea{resize:vertical;min-height:100px}main .updateProject button[type=submit]{background-color:var(--coral);color:#fff;cursor:pointer;border:none;border-radius:5px;padding:10px 20px;font-size:16px}main .updateProject button[type=submit]:hover{background-color:#ff7f50cc}.project-services{padding:20px}.project-services span{background-color:var(--coral);border-radius:15px;margin:5px;padding:4px 8px;font-size:18px;display:inline-block}.project-services select{border:1px solid var(--coral);border-radius:15px;margin-bottom:15px;padding:8px}.addForm{flex-direction:column;grid-area:1/1/3/3;gap:10px;width:100%;height:100%;margin:auto;padding:45px;display:flex}.addForm input,.addForm textarea,.addForm select{padding:8px;font-size:16px}.addForm button{background-color:var(--coral);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:10px;font-size:16px}.passwordForm{flex-direction:column;grid-area:1/1/3/3;gap:10px;width:100%;height:100%;margin:auto;padding:45px;display:flex;position:relative}.passwordForm input{border:2px solid var(--coral);background-color:#0000;border-radius:30px;margin-left:30px;padding:8px;font-size:16px}.passwordForm input:focus{border-color:var(--coral);outline:none}.passwordForm button{background-color:var(--coral);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:10px;font-size:16px}.passwordForm span{color:var(--coral);cursor:pointer;margin-left:20px;font-size:13px}.passwordForm .message{border:2px solid;border-right:none;border-radius:20px 0 0 20px;padding:5px 15px;font-size:15px;position:absolute;top:20px;right:0}.message.success{color:green;background-color:#d4edda;border-color:green}.message.error{color:red;background-color:#f8d7da;border-color:red}.passwordForm button:disabled{cursor:not-allowed;opacity:.6;margin-top:20px}.logout{border:1px solid var(--coral);color:var(--coral);cursor:pointer;border-radius:5px;margin-bottom:10px;padding:5px 10px;font-size:14px}.login{background:linear-gradient(214deg,var(--coral)24%,#f0e29c 43%,#589fc2 97%);border-radius:25px;gap:15px;width:900px;height:600px;padding:15px;font-size:13px;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.login form{flex-direction:column;justify-content:center;width:45%;padding:20px;display:flex}.login svg{object-fit:cover;border-radius:20px;width:60%;height:100%}.login label{gap:10px;margin-bottom:5px;margin-left:18px;display:flex}.login input{border-radius:var(--btn-radius);border:var(--btn-border);border-color:var(--coral);color:var(--coral);font-size:var(--btn-font-size);background-color:#0000;margin-bottom:25px;padding:13px}.login input[type=submit]{background-color:var(--coral);color:#fff;cursor:pointer;font-weight:600}.login span{color:var(--black);text-align:center;margin-bottom:20px;font-size:40px;font-weight:600}.login input[type=checkbox]{margin:0}.login a{text-align:center;color:var(--gray);font-size:12px;font-weight:400;text-decoration:underline}.login .close{stroke:#000;stroke-width:.2px;cursor:pointer;background-color:#ffffffd1;border:none;border-radius:50px;width:30px;height:30px;margin:15px;font-size:20px;font-weight:600;position:absolute;top:0;right:0}