.ucm-lp-hero{
    padding:50px 80px;
    overflow:hidden;
}

.ucm-lp-hero .content-col{
  display:flex;
  flex-direction:column;
  flex:1;
}

.school-logo{
  margin-bottom:49px;
  max-width:473px;
  max-height:80px;
  object-fit:contain;
}

.school-logo img{
  max-width:100%;
  height:auto;
}

.ucm-lp-hero h1{
  font-size:56px;
  font-family: 'ivymode';
  line-height:60px;
  font-weight:400;
  max-width:560px
}

.hero-description p{
  font-family:'proxima-nova'; 
  font-size:18px;
  line-height:27px;
  font-weight:400;
  max-width:520px;
}

.ucm-lp-hero .img-col{
  display:flex;
  flex:1
}

@media (min-width: 768px) {
  .ucm-lp-hero .content-wrapper.row-fluid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "logo image"
      "copy image";
    align-items: start;
    column-gap: 40px;
  }

  .ucm-lp-hero .school-logo,
  .ucm-lp-hero .content-col,
  .ucm-lp-hero .img-col {
    min-width: 0;
  }

  .ucm-lp-hero .school-logo {
    grid-area: logo;
    max-width: 100%;
  }

  .ucm-lp-hero .content-col {
    grid-area: copy;
    width: 100%;
  }

  .ucm-lp-hero .img-col {
    grid-area: image;
    width: 100%;
    height: 100%;
    align-self: stretch;
    overflow: hidden;
  }

  .ucm-lp-hero .hero-img-wrapper {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  .ucm-lp-hero {
    padding: 40px 32px;
  }

  .ucm-lp-hero .content-wrapper.row-fluid {
    column-gap: 32px;
  }

  .ucm-lp-hero h1 {
    font-size: 40px;
    line-height: 46px;
    max-width: none;
  }

  .ucm-lp-hero .content-col h2 {
    font-size: 20px;
    line-height: 28px;
    max-width: none;
  }

  .ucm-lp-hero .hero-description p {
    max-width: none;
  }

  .ucm-lp-hero .school-logo {
    margin-bottom: 32px;
  }
}



@media (max-width: 767px) {
  .ucm-lp-hero {
    padding: 25px;
  }
  
 .ucm-lp-hero h1, .hero-description p{
    max-width:100%;
  }

  .ucm-lp-hero .content-wrapper.row-fluid {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
      "logo"
      "image"
      "copy";
  }

  .ucm-lp-hero .school-logo {
    grid-area: logo;
    max-width: 100%;
    height: 40px;
    margin-bottom: 37px;
  }

  .ucm-lp-hero .img-col {
    grid-area: image;
    width: 100%;
    height: 200px;
  }

  .ucm-lp-hero .hero-img-wrapper {
    height: 200px;
    width: 100%;
    margin-bottom:25px;
  }

  .ucm-lp-hero .hero-img {
    height: 200px !important;
    width: 100%;
    object-fit: cover;
  }

  .ucm-lp-hero .content-col {
    grid-area: copy;
    width: 100%;
    margin-top:25px;
  }

  .ucm-lp-hero h1 {
    font-size: 36px;
    line-height: 42px;
    margin-bottom;25px;
  }
}