* {
  padding: 0;
  margin: 0;
}

.container-whats-dtx {
  background: linear-gradient(
    0deg,
    rgba(237, 145, 139, 0.7357317927170868) 40%,
    rgba(242, 248, 255, 0.7021183473389356) 48%
  );
}
/*
.container-whats-dtx{
  background: linear-gradient(-45deg, rgba(237, 145, 139), rgba(242, 248, 255), rgba(237, 145, 139), rgba(242, 248, 255));
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
	height: 100vh;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}*/

/* --------- Main --------- */

section {
  width: 75%;
}

/* --------- Section One --------- */

.section-one div {
  width: 50%;
}

.section-one h1 {
  margin-bottom: 20px;
}

.section-one p {
  padding-bottom: 20px;
  font-weight: 400;
  color: #5b5b5b;
}

/* -------- Section Two ---------- */

.section-two {
  padding-top: 50px;
}

.section-two iframe {
  width: 100%;
  height: 42vw;
  margin: auto;
}

/* -------- Section Three ---------- */

.section-three {
  display: flex;
  justify-content: space-between;
}

.section-three div:nth-of-type(1) {
  width: 60%;
}

.section-three div:nth-of-type(1) h1 {
  margin-bottom: 2rem;
}

.section-three div:nth-of-type(1) p {
  margin: 1rem 0;
}

/* -------- Section Four ---------- */

#section-four-container {
  background: url("/files/site/index/pluma.svg");
  background-repeat: no-repeat;
  background-position: -2% 117%;
}

.section-four {
  display: block;
  text-align: center;
}

.section-four h2 {
  margin-bottom: 2rem;
}

.eclipses {
  width: 100%;
  margin: 6rem 0;
}

.no-lapsi,
.with-lapsi {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.container-info-section-four {
  background: white;
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding: 20px;
  border-radius: 10px;
  align-items: center;
  height: 200px;
  width: 16%;
  margin: 0.5rem;
  box-shadow: 0px 20px 27px rgba(0, 0, 0, 0.07);
}

.no-lapsi .container-info-section-four p,
.no-lapsi .container-info-section-four strong,
.with-lapsi .container-info-section-four p,
.with-lapsi .container-info-section-four strong {
  font-size: 15px;
  color: #000000;
  margin-top: 1rem;
}

.no-lapsi .container-info-section-four strong,
.with-lapsi .container-info-section-four strong {
  font-weight: 800;
}

.alert {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  margin-top: 3rem;
}

.alert div p,
.alert div strong {
  color: white;
  font-size: 20px;
}

.alert div {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* -------- Background White ---------- */

.background-white {
  background: url(/files/site/whatsDtx/background.svg);
  background-repeat: no-repeat;
  background-position-y: 40%;
  background-size: cover;
}
.space {
  height: 20rem;
}
/* -------- Section Five ---------- */

/*
.section-five {
  display: block;
  text-align: center;
  background: url(/files/site/index/section-four/cruz.svg);
  background-repeat: no-repeat;
  background-position: left;
  position: relative;
  padding-top: 250px;
}

.sub-container-section-five {
  background: url(/files/site/index/section-four/circle.svg);
  background-repeat: no-repeat;
  background-position: 99% 22%;
  position: relative;
  background-size: 20%;
}*/

.section-five {
  display: block;
}

.section-five h1 {
  text-align: center;
  margin-bottom: 2rem;
}

.section-five img {
  width: 100%;
}

/*
.section-five h4,
.section-five h4 strong {
  font-size: 20px;
  color: #000000;
}*/

/*.section-five img{
  width: 60%;
}*/

.background-mobile {
  background: white;
}

.container-section-five {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: auto;
  z-index: 2;
}

/*
.container-section-five:nth-of-type(1) {
  width: 50%;
  margin-right: 10%;
}

.container-section-five:nth-of-type(1) div:nth-of-type(1) h4 {
  margin-bottom: 1rem;
}

.container-section-five:nth-of-type(2) {
  width: 80%;
}

.container-section-five:nth-of-type(2) div:nth-of-type(2) {
  display: flex;
  align-items: center;
  text-align: initial;
}

.container-section-five:nth-of-type(2) div:nth-of-type(2) .arrowsDtx {
  margin: 0 1rem;
}

.container-section-five:nth-of-type(2) div:nth-of-type(2) {
  width: 45%;
}

.container-section-five:nth-of-type(3) {
  justify-content: space-between;
  width: 70%;
}

.container-section-five:nth-of-type(3) div:nth-of-type(2) {
  width: 50%;
}

.float {
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0% {
    transform: translatey(0px);
  }
  50% {
    transform: translatey(-10px);
  }
  100% {
    transform: translatey(0px);
  }
}*/

/* -------- Section Six ---------- */

.background-plumas {
  background: url("/files/site/whatsDtx/plumas.svg");
  background-repeat: no-repeat;
}
.section-six {
  display: block;
  text-align: center;
  padding-bottom: 140px;
  width: 70%;
  padding-top: 100px;
}

.section-six form {
  display: flex;
  justify-content: space-evenly;
}

.section-six form div {
  display: flex;
  flex-direction: column;
  width: 40%;
}

textarea {
  margin-top: 25px;
  width: unset;
}

.section-six form div:nth-of-type(2) .button {
  background: #fce9a9;
  border: 2px solid #fce9a9;
  color: white;
  margin-top: unset;
}

.section-six form div:nth-of-type(2) .button:hover {
  color: #fce9a9;
  background: white;
  border: 2px solid #fce9a9;
}

form span {
  text-align: left;
}

/* ------- RESPONSIVE --------*/

@media screen and (max-width: 768px) {
  /* ------- Generales --------*/
  section {
    width: 90%;
    padding-top: 100px;
  }
  h1 {
    font-size: 30px;
    line-height: 31.35px;
  }
  h2 {
    font-size: 30px;
    line-height: 31.35px;
  }
  p,
  strong {
    font-size: 14px !important;
    line-height: 16px !important;
  }
  .container-whats-dtx {
    background: linear-gradient(
      0deg,
      rgba(237, 145, 139, 0.7357317927170868) 0%,
      rgba(242, 248, 255, 0.7021183473389356) 66%
    );
    margin: 2rem 0;
  }
  /*-------- Section One ---------*/
  .section-one {
    padding-top: 150px;
  }
  .section-one div {
    width: 100%;
  }
  /*-------- Section Two ---------*/
  .section-two iframe {
    height: 55vw;
  }
  /*-------- Section Three ---------*/
  .section-three div:nth-of-type(1) {
    width: 100%;
  }
  /*-------- Section Four ---------*/
  .section-four {
    width: 100%;
  }
  .container-info-section-four {
    margin: 3rem 0.5rem;
    height: 150px;
    padding: 4rem 0;
  }
  .container-info-section-four img {
    margin: auto;
  }
  .section-four h2 {
    margin-bottom: 0;
  }
  .alert {
    flex-direction: column;
    margin-top: 0;
  }
  .alert div {
    margin: 2rem 0;
  }
  .alert .arrows {
    transform: rotate(90deg) !important;
  }
  .alert div p {
    margin-top: 10px;
  }
  .space{
    display: none;
  }
  /*-------- Section Five ---------*/
  .section-five {
    padding-top: 150px !important;
  }
  .sub-container-section-five,
  .section-five {
    background: unset;
  }
  .lapsiSolutionMobile img {
    width: 100%;
  }
  /* Section 6 - form */
  .section-six {
    padding-bottom: 0;
  }
  .section-six h3 {
    font-size: 30px;
    line-height: 30px;
    width: 90%;
  }
  .section-six form {
    flex-direction: column;
  }
  .section-six form div {
    width: unset;
  }
  .background-mobile {
    background: white;
  }
  textarea {
    margin-top: 0;
  }
}
.background-white-two {
  background: none !important;
}

@media screen and (max-width: 1200px) {
  section {
    width: 90%;
  }
  /*-------- Section Two ---------*/
  .section-two {
    padding-top: 20px !important;
  }
  /*-------- Section Four ---------*/
  .section-four {
    width: 100%;
  }
  .container-info-section-four {
    margin: 3rem 0.5rem;
    height: 150px;
    padding: 1rem 0;
  }
  .container-info-section-four img {
    margin: auto;
  }
  .section-four h2 {
    margin-bottom: 0;
  }
  .background-white {
    background: none !important;
  }
  .background-white-two {
    background: url("/files/site/whatsDtx/background.png") !important;
    background-repeat: no-repeat;
    background-size: cover !important;
  }
  #section-four-container {
    background: none;
  }
  /*-------- Section Five ---------*/
  .section-five {
    width: 95%;
    padding-top: 180px;
  }
  .container-section-five {
    margin: unset;
  }
  .container-section-five:nth-of-type(2) {
    width: 100%;
    margin: auto;
  }
  .container-section-five:nth-of-type(1) {
    width: 13%;
    margin-right: 10%;
    margin: auto;
  }
  .container-section-five:nth-of-type(2) div:nth-of-type(2) .arrowsDtx {
    margin: 0;
  }
  .container-section-five:nth-of-type(3) {
    width: 95%;
    margin: auto;
  }
  .container-section-five:nth-of-type(3) div:nth-of-type(2) {
    background: unset;
  }
  .container-section-five:nth-of-type(3) div:nth-of-type(2) {
    width: 40%;
  }
  .section-six {
    width: 80% !important;
  }
}