* {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 body {
     font-family: "Electrolize", sans-serif;
 }

 header {
     height: 100vh;
     width: 100%;
     
     .first {

         .dark {
             width: 70px;
             height: 30px;
             border: 2px solid black;
             border-radius: 20px;
             position: fixed;
             right: 0;
             margin: 10px;


             >span {
                 background-color: black;
                 width: 25px;
                 height: 100%;
                 border-radius: 50%;
                 position: absolute;
                 top: 0;
                 left: 0;
                 cursor: pointer;
                 transition: .4s;
             }



         }

     }

     .toggle {
         background-color: rgb(179, 177, 177);
         color: white;
     }


     >h1 {
         text-align: center;
         font-size: 100px;
         margin: 50px;
     }

     >section {
         /* background-color: aquamarine; */
         display: flex;
         min-height: 20vh;
         justify-content: center;
         align-items: center;
         flex-direction: column;

         >div {
             width: 500px;
             height: 50px;
             display: flex;

             >input {
                 height: 100%;
                 width: 80%;
                 border: none;
                 outline: none;
                 padding: 10px;
                 font-size: 16px;
                 border-top-left-radius: 20px;
                 border-bottom-left-radius: 20px;
                 background-color: rgb(223, 223, 223);
                 

                 &:hover {
                     background-color: rgb(197, 197, 197);
                 }
             }

             >button {
                 width: 20%;
                 height: 100%;
                 border: none;
                 border-top-right-radius: 20px;
                 border-bottom-right-radius: 20px;
                 cursor: pointer;
                 font-family: "Electrolize", sans-serif;
                 font-weight: 500px;

                 &:hover {
                     background-color: rgb(223, 223, 223);
                 }
             }
         }

         ul {
             list-style: none;
             padding: 0;
             margin-top: 20px;
         }

         li {
             justify-content: space-evenly;
             align-items: center;
             padding: 10px;
             background-color: #f4f4f4;
             margin: 5px 0;
             border-radius: 4px;
             width: 500px;
             height: 50px;
             border-radius: 50px;
             display: flex;
             position: relative;

             >div {

                 &:nth-of-type(1) {
                     width: 80%;
                     height: 100%;

                     >h2 {
                         font-size: 20px;

                     }

                 }

                 &:nth-of-type(2) {
                     width: 20%;
                     height: 100%;


                     >span {
                         font-size: 25px;
                         cursor: pointer;



                     }
                 }

             }



         }
     }
 }

 .unText {
     text-decoration: line-through;
 }