@font-face{font-family:BentonSans-Bold;src:url(../fonts/BentonSans-Bold.eot);src:url(../fonts/BentonSans-Bold.eot) format("embedded-opentype"),url(../fonts/BentonSans-Bold.woff) format("woff"),url(../fonts/BentonSans-Bold.ttf) format("truetype"),url(../fonts/BentonSans-Bold.svg) format("svg");font-weight:700;font-style:normal}@font-face{font-family:BentonSans-Light;src:url(../fonts/Benton-Sans-Light.eot);src:url(../fonts/Benton-Sans-Light.eot) format("embedded-opentype"),url(../fonts/Benton-Sans-Light.woff) format("woff");font-weight:400;font-style:normal}*{margin:0;padding:0}

body {
  background: linear-gradient(180deg, #fbf6f2 0, #fbf6f2 158px, #01626b 0, #01626b) no-repeat;
  color: #fff;
  font-family: BentonSans-Light;
  font-size: 18px;
  font-weight: 300;
  height: 100vh;
  min-height: 570px;
  line-height: 28px;
  overflow-x: hidden;
  width: 100%;
  @media (min-width: 992px) {
    background: linear-gradient(90deg, #fbf6f2 0, #fbf6f2 28%, #01626b 0, #01626b);
    font-size: 20px;
  }
  @media (min-width: 1200px) {
    background: linear-gradient(90deg, #fbf6f2 0, #fbf6f2 33%, #01626b 0, #01626b);
  }
}
.container {
  align-items: center;
  display: flex;
  flex-direction: column;
  /*padding: 0 2rem;*/
  margin: 0;
  width: 100%;
  max-width: 100%;
  @media ( min-width: 992px) {
    flex-direction: row;
    height: 100%;
  }
}
.animation {
  padding-top:28px;
  &.basis-28 {
    flex-basis: 28%;
    @media (min-width: 1200px) {
      flex-basis: 33%;
    }
  }
  /*@media (min-width:992px){
      margin-left:calc(28% - 228px);
  }
  @media (min-width:1200px){
      margin-left:calc(28% - 172px);
  }*/
}
.animation__content {
  max-height: 250px;
  max-width: 375px;
  @media ( min-width: 992px) {
    height: auto;
    width: auto;
    max-height: 250px;
    max-width: 375px;
    margin-left: auto;
  }
  @media ( min-width: 1200px) {
    max-height: 300px;
    max-width: 450px;
  }
}
.text__wrapper{
  max-width:500px;
  padding: 0 3vw;
  @media ( min-width: 992px) {
    margin-left: 1.5vw;
    padding: 0;
  }
  @media ( min-width: 1200px) {
    margin-left: 3vw;
  }
}
h1 {
  font-family:BentonSans-Bold;
  font-size:35px;
  font-weight:400;
  line-height:46px;
  margin-bottom:1rem;
  hyphens: auto;
  @media (min-width:1200px){
    font-size:45px;
    line-height:56px;
  }
}

.dialog-off-canvas-main-canvas {
  height: 100%;
}