*,:after,:before{box-sizing:border-box}*{font-family:Arial,sans-serif;margin:0;padding:0}a{color:inherit;text-decoration:none}body{background-color:#d3d3d3;min-height:100vh;padding:30px}.container{margin:0 auto;width:500px}.tasks{background-color:#b0c4de;display:flex;flex-direction:column;gap:30px;min-height:calc(100vh - 98px);padding:20px}.title{padding-bottom:15px}.main-title{text-align:center}.form{position:relative}.tooltip{color:red;position:absolute}.tasks__input{display:block;font-size:inherit;padding:10px;width:100%}.tasks__input:focus{outline:2px solid #003cff}.task{background-color:#e0ffff;border:1px solid #000;border-radius:10px;padding:15px 90px 15px 30px;position:relative}.task:not(:last-child){border-bottom:0}.task__btn{border:1px solid #000;border-radius:50%;cursor:pointer;height:20px;position:absolute;right:60px;top:50%;transform:translateY(-50%);width:20px}.task__btn:hover{background-color:#adff2f}.task__btn_pin{height:20px;left:50%;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%);width:20px}.task__btn:has(.task__btn_pin):hover{background-color:#fcace5}.task__remove-btn{border:1px solid #000;border-radius:50%;cursor:pointer;height:20px;position:absolute;right:20px;top:50%;transform:translateY(-50%);width:20px}.task__remove-btn:hover{background-color:red}.task__remove-btn_pin{height:20px;left:50%;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%);width:20px}.copyrights{padding:20px 20px 0;text-align:center}.hidden{display:none}@media (max-width:560px){.container{width:100%}}