@import"https://fonts.googleapis.com/css2?family=Monoton&family=Quicksand:wght@500;700&display=swap";nav{background-color:#333;color:#fff;padding:10px 0;position:sticky;width:100%;top:0;left:0}ul .active{color:#71b8d9}ul{list-style:none;text-align:center}li{display:inline;margin-right:30px}a{text-decoration:none;color:#fff;font-weight:700}a:hover{text-decoration:underline}@media only screen and (max-width: 768px){.navbar{position:sticky}li{display:inline;margin-right:10px}}*{margin:0;padding:0;box-sizing:border-box}html{font-size:62.5%}body{font-size:2.4rem;font-family:sans-serif;color:#5a3e2b;font-family:Quicksand;font-weight:500}.app{width:100%;height:70vh;display:grid;grid-template-rows:auto 1fr auto}.load{text-align:center;color:red}h1{text-align:center;background-color:#f4a226;font-family:Monoton;font-size:8rem;text-transform:uppercase;font-weight:400;word-spacing:30px;letter-spacing:-5px;padding:2.4rem 0}.add-form{background-color:#e5771f;padding:2.8rem 0;display:flex;align-items:center;justify-content:center;gap:.8rem}h3{margin-right:1.6rem;font-size:2.4rem}button,select,input{background-color:#ffebb3;color:#5a3e2b;font-family:inherit;border:none;border-radius:10rem;padding:1.2rem 3.2rem;font-weight:700;font-size:1.8rem;cursor:pointer}.add-form button{text-transform:uppercase;background-color:#76c7ad}main{background-color:#5a3e2b}.list{color:#ffebb3;padding:4rem 0;display:flex;justify-content:space-between;flex-direction:column;gap:3.2rem;align-items:center}.actions button,.list select{text-transform:uppercase;padding:.8rem 2.4rem;font-size:1.4rem;font-weight:700;margin:0 .8rem}.list ul{list-style:none;width:80%;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.2rem;justify-content:center;align-content:start}.list li{display:flex;align-items:center;gap:1.2rem}input[type=checkbox]{height:2rem;width:2rem;accent-color:#e5771f}.list li button{cursor:pointer;background:none;border:none;font-size:1.8rem;padding:.8rem;transform:translateY(2px)}.stats{background-color:#76c7ad;text-align:center;font-weight:700;padding:3.2rem 0}@media only screen and (max-width: 768px){h1{font-weight:200;font-size:4rem}.app{grid-template-rows:auto auto 1fr auto}.add-form{flex-direction:column;align-items:center;justify-content:center}h3{text-align:center}.flex-list{display:flex;margin-left:50px}input[type=checkbox]{margin-right:20px}.stats{font-weight:300;padding:20px}.actions{font-weight:300;margin:0 .5rem;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px}}._container_1r160_1{display:flex;justify-content:center;padding:40px}._formContainer_1r160_6{display:flex;justify-content:center;align-items:center}._formGroup_1r160_12{box-shadow:0 5px 10px #0003;padding:50px;width:min-content}._field_1r160_18{display:flex;flex-direction:column;justify-content:center}._field_1r160_18 input{background-color:#f6f6f6}._btn_1r160_27{color:#fff;font-size:18px;outline:none;border:none;margin-top:25px;border-radius:6px;cursor:pointer;transition:all .3s ease}textarea{padding:10px;width:100%;height:150px}._error_1r160_42{color:red;margin:5px 0;display:block}._leftSide_1r160_48{display:flex;flex-direction:column;justify-content:space-around;margin:20px;padding:20px;box-shadow:0 0 10px #0003}._details_1r160_58{text-align:center}._details_1r160_58 i{font-size:24px;margin-bottom:10px}._topic_1r160_68{font-size:16px;font-weight:700;margin-bottom:5px}._textOne_1r160_74{font-size:14px;color:#333}._textTwo_1r160_80{font-size:14px;color:#555}@media only screen and (max-width: 768px){._container_1r160_1{flex-direction:column-reverse}._formGroup_1r160_12{padding:25px;width:100%}textarea{width:90%}}.about-container{display:flex;justify-content:center;align-items:center;max-width:1200px;margin:0 auto;padding:20px}.left{flex:1;padding:10px}.image img{display:block;max-width:100%;height:auto}.right{flex:1;padding:5px}.subtitle{color:#718096;border-bottom:2px solid #667eea;text-transform:uppercase}.title{margin-top:20px;font-weight:700;font-size:24px;line-height:1.2}.highlight{color:#667eea}.description{color:#4a5568;margin-top:10px;margin-bottom:5px;font-size:16px;line-height:1.5}@media only screen and (max-width: 768px){.about-container{flex-direction:column}}
