* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
body {
  font-family: Arial, sans-serif;
  background-color: #f4f4f4;
  color: #222;
}
.hero {
  width: 1920px;
  height: 1080px;
  margin: 0;
  display: flex;
  overflow: hidden;
  background-color: #ddd;
}
.hero-left {
  width: 1495px;
  height: 1080px;
  overflow: hidden;
  position: relative;
}
.hero-divider {
  width: 5px;
  height: 1080px;
  background-color: #ffffff;
  flex-shrink: 0;
}
.hero-right {
  width: 420px;
  height: 1080px;
  overflow: hidden;
  position: relative;
}
.hero-left img,
.hero-right img {
  width: 100%;
  height: 100%;
  display: block;
  opacity: 1;
  transition: opacity 1s ease-in-out;
}
.content {
  max-width: 1000px;
  margin: 40px auto;
  padding: 0 20px;
}
.content h1 {
  margin-bottom: 20px;
}