.content::before {
  content: "";
  position: absolute;
  background-image: url("../../images/vector_1-1700.svg");
  width: 1500px;
  height: 1250px;
  top: -5px;
  z-index: -1;
}
.wrapper {
  position: relative;
  overflow-x: hidden;
  width: 100vw;
}

.content__wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-left: 200px;
  animation: 1s ease-out 1 0s appearFromLeft;
}
.content__header {
  width: 850px;
  color: white;
  font-family: Helvetica, sans-serif;
  font-size: 64px;
  line-height: 77px;
  letter-spacing: 2px;
  margin-top: 40px;
  margin-bottom: 60px;
}
.content__group {
  display: flex;
  margin-bottom: 80px;
}

.content__paragraph {
  width: 540px;
  color: white;
  font-family: Helvetica, sans-serif;
  font-size: 24px;
  line-height: 29px;
  letter-spacing: 1px;
}
.content__vector {
  width: 603px;
  height: 384px;
  margin-top: -30px;
  margin-left: 60px;
}

.content__tile {
  background-color: white;
  border-radius: 20px;
  text-align: center;
  margin: 0 auto;
  width: 1130px;
  box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.25);
}
.content__tile-paragraph {
  margin: 44px 44px 0 44px;
  padding-top: 40px;
  font-size: 24px;
  line-height: 29px;
  font-family: Helvetica, sans-serif;
  font-weight: bold;
  color: #0033a0;
}
.content__button {
  padding: 14px 37px;
  background: linear-gradient(298.16deg, #b40100 0.23%, #fc2801 93.89%);
  border-radius: 72px;
  font-family: Montserrat, sans-serif;
  font-weight: bold;
  font-size: 24px;
  line-height: 29px;
  border: none;
  color: white;
  margin: 40px auto;
  box-shadow: 0px 23px 30px -12px rgba(180, 1, 0, 0.5);
  transition: all 0.3s ease-in;
}
.content__button:hover {
  box-shadow: 0px 23px 30px -12px rgba(180, 1, 0, 0.8);
  cursor: pointer;
}
.content__tile:hover {
  transition: all 0.3s ease-in;
  transform: scale(1.02);
}

@media (max-width: 1450px) {
  .content::before {
    content: "";
    position: absolute;
    background-image: url("../../images/vector_1.svg");
    width: 1350px;
    height: 1130px;
  }
  .content__wrapper {
    margin-left: 150px;
  }
  .content__vector {
    margin-left: 30px;
  }
}

@media (max-width: 1240px) {
  .content__tile-wrapper {
    flex-wrap: wrap;
  }
  .content__wrapper {
    margin-left: 100px;
  }

  .content__tile {
    width: 80%;
    margin: 30px auto;
  }
  .content__tile-paragraph {
    font-size: 20px;
    line-height: 25px;
  }
  .content__vector {
    display: none;
  }
  .content__header {
    width: 80vw;
    font-size: 52px;
    line-height: 64px;
  }
  .content__paragraph {
    font-size: 21px;
    line-height: 25px;
    letter-spacing: 1px;
  }
}
@media (max-width: 767px) {
  .content__mobile-disappear {
    display: none;
  }
  .content__tile {
    width: 90%;
    margin: 30px auto;
  }
  .content__button {
    font-size: 22px;
    padding: 10px 12px;
  }
  .content__wrapper {
    width: 100vw;
    margin-left: 0px;
  }
  .content__tile {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .content__tile-paragraph {
    font-size: 20px;
    line-height: 25px;
    margin: 10px 20px;
  }
  .content__vector {
    display: none;
  }
  .content__header {
    width: 90vw;
    margin: 0 auto;
    margin-top: 45px;
    font-size: 34px;
    line-height: 48px;
    letter-spacing: 1px;
  }
  .content__group {
    width: 90vw;
    margin: 30px auto;
  }
  .content__paragraph {
    color: white;
    font-size: 17px;
    line-height: 21px;
    letter-spacing: 0px;
  }
}
@keyframes appearFromLeft {
  0% {
    opacity: 0;
    transform: translateX(-100px);
  }
  100% {
    opacity: 1;
    transform: translateX(0px);
  }
}
@keyframes appearFromBottom {
  0% {
    opacity: 0;
    transform: translateY(-100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
