:root {
	--dark: #374151;
	--darker: #1F2937;
	--darkest: #111827;
	--grey: #6B7280;
	--pink: #EC4899;
	--purple: #8B5CF6;
	--light: #EEE;
  }
  body {
    background: #464646 url(background_2.jpg) no-repeat fixed center center;
    background-size: cover;
    justify-content: center;
    text-align: center;
  }

  header {
    padding: 2rem 1rem;
    margin: 0 auto;
  }

  #new-task-form {
    display: flex;;
  }

  input, button {
    appearance: none;
    border: none;
    outline: none;
    background: none;
  }

  #new-task-input {
    background-color: var(--darker);
    padding: 0.2rem;
    border-radius: 0.3rem;
    color: var(--light);
  }

  #new-task-input::placeholder {
    color: var(--grey);
  }

  #new-task-submit {
    color: var(--pink);
    cursor: pointer;
    transition: 0.4s;
  }

  .task-list {
    padding: 0.2rem;
  }

  .task-list h3 {
    font-weight: 800;
    color: var(--darkest);
    justify-content: center;
    letter-spacing: 0.05em;
  }

  #tasks .task {
    display: flex;
    justify-content: space-between;
    background-color: var(--darkest);
    padding: 0.2rem;
    border-radius: 1rem;
    margin-bottom: 0.2rem;
  }

  .task .content .text {
    color: var(--light);
    display: block;
  }

  .task .actions {
    display: flex;
  }

  .task .actions button {
    cursor: pointer;
    margin: 0 0.5rem;
  }

  img{
    margin: 20px;
    width: 50px;
    height: 50px;
    padding-top: 104px;
  }
  
.logo {
  display: flex;
  justify-content: center;
  margin-top: 70px;
}

  .task .actions .delete, .task .actions .edit  {
    color: crimson;
  }
  
  a{
    justify-items: center;
    align-items: center;
  }

  #new-task-form{
    display: inline;
  }