body {
  text-align: center;
  margin: 0;
  background: white;
  font-family: 'Montserrat', sans-serif;
  font-size: 1em;
  padding: 90px;
}

.header-page {
  margin-left: 200px;
  margin-right: 200px;
}

.header-page p {
  font-style: italic;
  font-size: 10px;
  max-width: 700px;
  margin: 0 auto;
  font-size: 1rem;
}

h1 {
  padding-top: 10px;
  font-size: 26px;
}

h2 {
  margin-top: 18px;
}

.container-landing {
  display: flex;
  padding: 10px;
}

.container-image {
  position: relative;
  right: 22px;
  bottom: 5px;
}

.container {
  text-align: center;
  padding: .8em 1.2em;
  display: flex;
  flex-direction: column;
  padding-right: 15px;
  max-width: 700px;
  margin: 0 auto;
}

hr.line {
  height: 1.5px;
  border: 0;
  color: #333;
  background-color: #333;
  width:50%;
  text-align: center;
  position: relative;
  bottom: 10px;
}

.time-frame-container {
  display: flex;
  align-items: center;
  height: 100%;
  flex-direction: column;
}

.block-1 {
  flex-basis: 50%;
}

.block-1 p {
  /*margin-bottom: 33px;*/
  text-align: center;
}

.block-2 {
  flex-basis: 50%;
}

.block-2 p {
  text-align: center;
  margin-top: 45px;
  /*padding-bottom: 2px;*/
}

.time-frame-container {
  display: flex;
  justify-content: space-around;
}

.dates-field {
  display: flex;
  justify-content: space-around;
  margin-bottom : 2em;
  margin-top: 18px;
  margin-right: 10px;
}

img {
  width: 50px;
  border-radius: 50px;
  max-width: 300px;
}

input {
  border: 2px solid #ddd1d1;
  /*border-radius: 20px;*/
  padding: 12px 10px;
  text-align: center;
  width: 230px;
  font-style: italic;
  margin-bottom: 10px;
  margin-right: 10px;
}



.btn-container {
  display: flex;
  justify-content: center;
  margin-bottom: 45px;
}

.add-btn {
  background: #ff6666;
  width: auto;
  color: #fff;
  border-radius: 10px;
  padding: 13px;
  text-decoration: none;
  font-size: 17px;
  font-weight: bold;
  position: relative;

}

button {
  background: #00CC80;
  width: 230px;
  color: #fff;
  border-radius: 10px;
  padding: 13px;
  text-decoration: none;
  font-size: 17px;
  font-weight: bold;
  margin-left: 45px;
  margin-bottom: 18px;
}

button:hover {
  cursor: pointer;
  opacity: 70%;
}

.del {
  width: auto;
  margin: 5px auto 20px auto;
  background-color: lightgrey;
  position: absolute;
  padding: 5px;
}


@media screen and (max-width: 1170px) {

  .body {
    display: block
  }

  .container {
    width : 95%;
    padding: .8em;
  }

}

.results {
  margin-top: 20px;
}

@media screen and (max-width: 870px) {

  .body {
      display: block
    }

  .header-page {

    width : 95%;
    padding: .8em;
    margin: 0px;

  }

  .container-landing {
    display: block;
  }

  .container-image {
      width : 90%;
      margin: 5px;
    }

  .btn-container {
    display: block;
  }

  .container {
      width : 95%;
      padding: .8em;
      margin: 0px;
    }

  img {
    max-width: 100%;
    margin-left: 40px;
  }

  .dates-field {
    display: block;
    padding: 2%;
    }

  .time-frame-container {
    display: block;
    }

  #entry-date-1 {
    margin-bottom: 10px;
  }

  .button: {
      width: 90%;
    }

  .add-btn {
    margin-left: 0px;
    position: relative;
    right: 0px;
  }

  #submit-btn {
    margin-left: 0px;

}

}




/*.wrapper {

}

.stays {


}

.form_group {


}*/

/*@import '../node_modules/flatpickr/dist/flatpickr.min.css';*/