.headingA {
  position: relative;
  display: flex;
  font-weight: 800;
  top: 70px;
  font-size: 3rem;
  height: 400px;
  background: url("https://images.unsplash.com/photo-1534227749049-06c3ed80963c?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=750&q=80")
    no-repeat center top/cover;
  align-items: center;
  justify-content: center;
}
.line {
  margin: 0 8px;
  background: #1a202c;
  height: 0;
  width: 8px;
  transition: all 1s ease;
}

.lineon {
  height: 60px;
}
.title {
  position: relative;
  right: 20px;
  opacity: 0;
  transition: all 0.8s ease;
}
.titleon {
  transform: translateX(30px);
  opacity: 1;
}
.Content1,
.Content2 {
  text-align: justify;
  display: grid;
  column-gap: 60px;
  row-gap: 30px;
  font-weight: 500;
  margin: 190px 70px;
}
.Content1 {
  grid-template-columns: 65% 35%;
}
.Content2 {
  grid-template-columns: 35% 65%;
}
.Imageabt {
  width: 400px;
  height: 400px;
  overflow: hidden;
}
.mImage {
  transition: all 0.3s ease-in;
}
.Imageabt:hover .mImage {
  transition: all 0.3s ease-in;
  transform: scale(1.1);
}
.imagecontainer {
  height: 400px;
  width: 400px;
}
.imagecontainer::after {
  content: "";
  display: block;
  position: relative;
  z-index: -1;
  bottom: 380px;
  right: 30px;
  width: 100%;
  height: 100%;
  border: 4px solid #4c5870;
}
.text h1 {
  font-size: 50px;
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  .Content1,
  .Content2 {
    margin: 190px 30px;
    grid-template-columns: 1fr;
  }
  .imagecontainer::after {
    bottom: 380px;
    left: 30px;
  }
}
