@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700&display=swap");

:root {
  --dark-color: #000;
  --white-color: #fff;
}

.dark-mode {
   color: var(--white-color) !important;
   background: var(--dark-color) !important;
}

body {
   font-family: "Poppins", sans-serif;
   background: var(--white-color);
   color: var(--dark-color);
   transition: all 0.6s ease-in-out;
}

main {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100vh;
   display: flex;
   align-items: center;
   justify-content: center;
}

.header {
   margin: auto;
   width: 80%;
   height: 10vh;
   padding: 0.5rem 4rem;
   display: flex;
   align-items: center;
   justify-content: space-between;
}

#icon {
   width: 30px;
   cursor: pointer;
}

main {
    z-index: -1;
}

main h1 {
    font-size: 5rem;
}

main h1 span {
    color: rgb(194, 103, 50);
}