.host-topic-page .hero-wrap
{
  background-color: #0585c8;
  display: inline-block;
  min-height: 532px;
  position: relative;
  width: 100%
}

.host-topic-page .hero-wrap > div
{
  position: relative;
  z-index: 1
}

.host-topic-page .hero-wrap:before
{
  background-image: url(images/curve-line.png);
  background-position: bottom;
  background-size: 100% 100%;
  bottom: 0;
  content: "";
  height: 170px;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: 1
}

.host-topic-page .about .hero-wrap:before, .host-topic-page .support .hero-wrap:before
{
  background-image: url(images/curve-gline.webp);
  content: ""
}

.host-topic-page .hero-otr
{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between
}

.host-topic-page .hero-left
{
  width: 50%
}

.host-topic-page .hero-rgt
{
  background-position: 50%;
  background-size: cover;
  position: relative;
  width: 50%
}

.host-topic-page .hero-rgt:before
{
  background-image: url(images/curve-shape.webp);
  background-position: 100%;
  background-size: 100% 100%;
  bottom: 0;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  width: 200px
}

.host-topic-page .hero-inner
{
  align-items: center;
  display: flex;
  float: right;
  max-width: 620px;
  min-height: 532px;
  padding: 100px 20px;
  position: relative
}

.host-topic-page .hero-header
{
  padding-bottom: 32px
}

.host-topic-page .hero-header h1
{
  color: #fff;
  margin-bottom: 0 !important
}

.host-topic-page .hero-text p
{
  color: #fff;
  margin-bottom: 16px
}

.host-topic-page .hero-text p:last-child
{
  margin: 0
}

.host-topic-page .hero-image
{
  display: none
}

.host-topic-page .hero-header, .host-topic-page .hero-text
{
  width: 100%
}

.host-topic-page .support .hero-header
{
  padding-bottom: 50px
}

@media (max-width:1080px)
{
  .host-topic-page .support .hero-header
  {
    padding-bottom: 0
  }

  .host-topic-page .hero-wrap
  {
    min-height: auto
  }

  .host-topic-page .hero-inner
  {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    min-height: 370px;
    padding: 70px 20px
  }

  .host-topic-page .hero-rgt:before
  {
    content: "";
    height: 100%;
    width: 100px
  }
}

@media (max-width:767px)
{
  .host-topic-page .hero-wrap:before
  {
    content: "";
    height: 80px
  }

  .host-topic-page .hero-left, .host-topic-page .hero-rgt
  {
    width: 100%
  }

  .host-topic-page .hero-inner
  {
    float: left;
    max-width: 100%;
    min-height: auto;
    padding: 80px 20px
  }

  .host-topic-page .hero-image
  {
    display: block
  }

  .host-topic-page .hero-rgt:before
  {
    content: "";
    height: 100%;
    width: 0
  }

  .host-topic-page .hero-wrap
  {
    min-height: auto
  }

  .host-topic-page .hero-image img
  {
    height: 370px !important;
    object-fit: cover
  }

  .host-topic-page .resources .hero-image img
  {
    height: 300px !important;
    object-fit: cover
  }

  .host-topic-page .product .hero-image img
  {
    height: 320px !important;
    object-fit: cover
  }
}

@media (max-width:479px)
{
  .host-topic-page .hero-inner
  {
    padding: 60px 20px
  }

  .host-topic-page .hero-wrap:before
  {
    background-image: url(images/mobile-shape.webp);
    content: "";
    height: 120px
  }

  .host-topic-page .about .hero-wrap:before, .host-topic-page .support .hero-wrap:before
  {
    background-image: url(images/mob-shape-2.png);
    content: ""
  }

  .host-topic-page .about .hero-image img, .host-topic-page .support .hero-image img
  {
    height: 270px !important
  }
}



.html-topic-page .center-1{
    max-width:100%;
    width:100%;
}