.u-section-1 {
  background-image: linear-gradient(0deg, rgba(37,175,180,0.4), rgba(37,175,180,0.4)), url("images/warlords-of-draenor-nagrand_landscape.jpg");
  background-position: 50% 50%;
}

.u-section-1 .u-sheet-1 {
  min-height: 302px;
}

.u-section-1 .u-text-1 {
  font-weight: 700;
  text-transform: uppercase;
  font-size: 6rem;
  margin: 60px auto;
}

@media (max-width: 1199px) {
  .u-section-1 .u-sheet-1 {
    min-height: 249px;
  }
}

@media (max-width: 991px) {
  .u-section-1 .u-sheet-1 {
    min-height: 191px;
  }
}

@media (max-width: 767px) {
  .u-section-1 .u-sheet-1 {
    min-height: 143px;
  }

  .u-section-1 .u-text-1 {
    font-size: 3.75rem;
  }
}

@media (max-width: 575px) {
  .u-section-1 .u-sheet-1 {
    min-height: 90px;
  }

  .u-section-1 .u-text-1 {
    font-size: 3rem;
  }
}.u-section-2 .u-sheet-1 {
  min-height: 582px;
}

.u-section-2 .u-shape-1 {
  height: 409px;
  width: 749px;
  margin: 138px 90px 0 301px;
}

.u-section-2 .u-shape-2 {
  height: 422px;
  width: 403px;
  margin: -466px 647px 0 90px;
}

.u-section-2 .u-image-1 {
  width: 375px;
  height: 416px;
  margin: -468px 0 0 148px;
}

.u-section-2 .u-group-1 {
  min-height: 276px;
  width: 423px;
  height: auto;
  margin: -246px 134px 60px auto;
}

.u-section-2 .u-container-layout-1 {
  padding: 20px 30px;
}

.u-section-2 .u-text-1 {
  margin: 83px 0 0;
}

.u-section-2 .u-text-2 {
  margin: 28px 0 0;
}

@media (max-width: 1199px) {
  .u-section-2 .u-sheet-1 {
    min-height: 600px;
  }

  .u-section-2 .u-shape-1 {
    width: 618px;
    margin-right: 74px;
    margin-left: 248px;
  }

  .u-section-2 .u-shape-2 {
    width: 366px;
    margin-right: 500px;
    margin-left: 74px;
  }

  .u-section-2 .u-image-1 {
    width: 348px;
    margin-left: 122px;
  }

  .u-section-2 .u-group-1 {
    margin-right: 101px;
    margin-left: 490px;
    height: auto;
  }

  .u-section-2 .u-container-layout-1 {
    padding-left: 25px;
    padding-right: 25px;
  }
}

@media (max-width: 991px) {
  .u-section-2 .u-sheet-1 {
    min-height: 580px;
  }

  .u-section-2 .u-shape-1 {
    width: 530px;
    margin-right: 0;
    margin-left: 190px;
  }

  .u-section-2 .u-shape-2 {
    width: 331px;
    margin-right: 389px;
    margin-left: 0;
  }

  .u-section-2 .u-image-1 {
    width: 318px;
    margin-left: 49px;
  }

  .u-section-2 .u-group-1 {
    margin-right: 24px;
    margin-bottom: 39px;
    margin-left: 375px;
  }

  .u-section-2 .u-container-layout-1 {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media (max-width: 767px) {
  .u-section-2 .u-sheet-1 {
    min-height: 810px;
  }

  .u-section-2 .u-shape-1 {
    height: 610px;
    width: 397px;
    margin-left: 143px;
  }

  .u-section-2 .u-shape-2 {
    width: 369px;
    margin-top: -665px;
    margin-right: 171px;
  }

  .u-section-2 .u-image-1 {
    width: 357px;
    height: 430px;
    margin-top: -470px;
    margin-left: 46px;
  }

  .u-section-2 .u-group-1 {
    min-height: 201px;
    margin: 61px 35px 80px 170px;
  }

  .u-section-2 .u-container-layout-1 {
    padding-left: 10px;
    padding-right: 10px;
  }
}

@media (max-width: 575px) {
  .u-section-2 .u-sheet-1 {
    min-height: 599px;
  }

  .u-section-2 .u-shape-1 {
    height: 422px;
    width: 288px;
    margin-right: -2px;
    margin-left: 54px;
  }

  .u-section-2 .u-shape-2 {
    height: 318px;
    width: 252px;
    margin-top: -479px;
    margin-right: 88px;
    margin-left: 1px;
  }

  .u-section-2 .u-image-1 {
    width: 252px;
    height: 307px;
    margin-top: -363px;
    margin-left: 44px;
  }

  .u-section-2 .u-group-1 {
    min-height: 124px;
    width: 340px;
    margin: 72px 12px 60px 67px;
  }
}