html,body{margin:0;padding:0;width:100%;height:100%;box-sizing:border-box;font-family:sans-serif;overflow-y:auto}.main-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center;margin-top:0}.todo-container{width:414px;min-height:944px;display:flex;flex-direction:column;box-shadow:0 4px 4px #00000026;position:relative;background-color:#f3f3f3}.todo-header{width:100%;background-color:#3556ab;height:123px;box-shadow:0 4px 4px #00000026}.avatar-image{height:100%;width:100%;border-radius:50%}.todo-header-info{width:292px;padding-top:19px;padding-left:32px;display:flex;height:84px}.avatar{height:50px;width:50px;background-color:#000;border-radius:50%;margin-right:15px}.greeting-container{width:221px;height:100%;display:flex;flex-direction:column;justify-content:center}.greeting-container h1{font-family:Roboto,sans-serif;font-size:16px;font-weight:500;line-height:18.75px;color:#fff;margin:0 0 5px;text-shadow:0px 2px 0px rgba(0,0,0,.6)}.greeting-container span{font-family:Roboto,sans-serif;font-size:25px;font-style:italic;font-weight:100;text-align:left;color:#fff;text-shadow:0px 2px 0px rgba(0,0,0,.6);margin:0;line-height:26.46px;height:52px}.go-pro-container{width:390;height:116px;background-color:#f2c94c;border:2px solid #9EB031;position:relative;box-shadow:0 4px 4px #0000001a}.go-pro-content-container{border-top:1px solid white;width:100%;height:116px;display:flex;align-items:center}.go-pro-content{height:40.89px;width:276.07px;display:flex;align-items:center;margin-left:24.93px}.trophy-image{width:53.1px;height:40.89px}.go-pro-text{font-family:Roboto,sans-serif;font-size:18px;font-weight:700;line-height:19.05px;text-align:left;color:#071d55;text-shadow:0px 1px 0px #FFFFFF;text-align:center;margin-left:24.93px}.go-pro-price-container{width:66.11px;height:71px;background-color:#071d55;position:absolute;top:0;margin-top:-2px;right:0;margin-right:19px;display:flex;align-items:center;justify-content:center}.go-pro-price{color:#f2c94c;font-family:Roboto,sans-serif;font-size:18px;font-weight:500;line-height:19.05px;text-align:left}.task-list{margin-bottom:100px}.task{display:flex;align-items:center;justify-content:space-between;border-radius:5px;height:89px;width:380px;margin:23px auto;box-shadow:0 4px 4px #0000001a;border:1px solid #E7E7E7}.check-buttons{margin:0 20px;height:32px;width:32px;cursor:pointer}.task-text,.completed-task-text{font-family:Roboto;font-size:16px;font-weight:500;line-height:16.08px;text-align:left;color:#071d55;cursor:pointer}.completed-task-text{color:#8d8d8d;text-decoration:line-through}.edit-button{margin:0 15px;width:51px;height:45px;border:1px solid #071D55;border-radius:4px;background-color:transparent;font-family:Roboto;font-size:16px;font-weight:500;line-height:18.75px;text-align:center;cursor:pointer}.add-task-button{width:56px;height:57px;border-radius:100px;border:2px solid #123EB1;display:flex;background:#3556ab;box-shadow:0 3px 1px #a8b5de80 inset;box-shadow:0 4px 4px #00000040;position:absolute;cursor:pointer;bottom:0;right:0;margin:20px}.add-task-button__inner{width:100%;height:100%;border:5px;border-radius:50px;box-shadow:0 1px 0 -0px #a8b5de80 inset;margin-top:1px;margin-left:auto;margin-right:auto}.button-text-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.button-text{color:#fff;font-family:Roboto;font-size:36px;font-weight:400;line-height:42.19px;text-align:left;text-shadow:0px 2px 0px #000000}.edit-task-container{width:635px;background-color:#f3f3f3;min-height:944px;position:relative}.edit-task-header{width:635px;height:123px;background:#3556ab;box-shadow:0 4px 4px #00000026;display:flex;align-items:center;justify-content:center}.edit-task-title{font-family:Roboto;font-size:24px;font-weight:500;line-height:28.13px;text-align:left;color:#fff}.edit-task-body{width:100%;padding:28px 20px 0;box-sizing:border-box}.input-group label{font-family:Roboto;font-size:16px;font-weight:400;line-height:19.44px;letter-spacing:.115em;text-align:left;color:#000;padding-top:28px}.input-group input{margin-top:15px;padding:24px;box-sizing:border-box;width:596px;border:2px solid #CBCBCB;border-radius:9px;font-family:Roboto;font-size:20px;font-weight:400;text-align:left;color:#0d2972;height:69px}.input-group input:focus{outline-width:0}.create-or-edit-task-button-container{width:577px;height:354px;position:absolute;display:flex;align-items:flex-end;justify-content:space-between;transform:translate(-50%);left:50%;bottom:0}.save-button{width:432px;height:61px;border-radius:6px;border:2px solid #0D2972;display:flex;background:#3556ab;box-shadow:0 3px 1px #a8b5de80 inset;box-shadow:0 4px 4px #00000040;cursor:pointer;position:relative;margin-bottom:20px}.save-button__inner{width:100%;height:100%;border:5px;border-radius:6px;box-shadow:0 1px 0 -0px #a8b5de80 inset;margin-top:1px;margin-left:auto;margin-right:auto}.delete-button{width:117px;height:61px;border-radius:6px;border:2px solid #720D0D;display:flex;background:#ab3535;box-shadow:0 3px 1px #a8b5de80 inset;box-shadow:0 4px 4px #00000040;cursor:pointer;position:relative;margin-bottom:20px}.delete-button__inner{width:100%;height:100%;border:5px;border-radius:6px;box-shadow:0 1px 0 -0px #a8b5de80 inset;margin-top:1px;margin-left:auto;margin-right:auto}.delete-button-text,.save-button-text{color:#fff;text-shadow:0px 2px 0px #000000;font-family:Roboto;font-size:18px;font-weight:400;line-height:21.09px;text-align:center}