.image-banner {
  width:100%;
  padding:400px 10% 150px;
  position:relative;
  background-color:#000;
  text-align:center;
}

@media(min-width:1024px) {
  .image-banner {
    min-height:100vh;
    padding:10% 10% 18%;
    text-align:left;
  }
}

.image-banner__image {
  position:absolute;
  display:block;
  width:100%;
  height:350px;
  top:0;
  left:0;
  background-position:right top;
  background-size: 200% auto;
  background-repeat: no-repeat;
}

@media(min-width:1024px) {
  .image-banner__image {
    height:100%;
    background-position:center;
    background-size:cover;
  }
  
  @supports ( -webkit-touch-callout : none) {
    .image-banner__image {
      background-attachment:scroll
    }
  }

  @supports not ( -webkit-touch-callout : none) {
    .image-banner__image {
      background-attachment: fixed;
      }
  }
}

.image-banner__title {
  position:relative;
  color:#fff;
  font-style:italic;
  font-size:clamp(2.25rem, 6vw, 3.75rem);
}

@media(min-width:1024px) {
  .image-banner__title {
    max-width:45%;
  }
}

.image-banner__content {
  position:relative;
  color:#fff;
  font-size:1.125rem;
}

.image-banner__content p, .image-banner__content ul {
  font-size:1.125rem;
}

@media(max-width:1024px){
  .image-banner__content ul {    
      flex-direction: column;
      justify-content: center;
      align-items: center;
      max-width: 290px;
      padding: 0;
      text-align: left;
      margin: 0 auto 20px;
  }
}

@media(min-width:1024px) {
  .image-banner__content {
    max-width:45%;
  }
}

.image-banner__content {
  font-size:clamp(0.938rem, 6vw, 1.125rem);
  color:#fff;
}

.image-banner .sketch-button { 
  margin:40px auto 0;
}

@media(min-width:1024px) { 
  .image-banner .sketch-button { 
    margin:40px 0 0;
  }
}
