html,body {
    width:100%;
    height: auto;
    margin:0;
    padding:0;
    overflow-x: hidden;
    scroll-behavior: smooth;
}
body {
  position: relative;
	font-size:14px;
	line-height:24px;
  color: #000;
  font-family: 'Open Sans', sans-serif;
}

@max767: ~"(max-width: 767px)";
@min768: ~"(min-width: 767px)";
@max991: ~"(max-width: 991px)";
@max1200: ~"(max-width: 1200px)";

.wrapper{
  top: 0px;
  left: 0px;
  height: auto;
  background: #3A4046 0% 0% no-repeat padding-box;
  opacity: 1;
  padding: 0px;
}
.leftbar{
  top: 9px;
  left: 0.4462890625px;
  width: 104px;
  height: 1070px;
  //transform: matrix(0, 1, -1, 0, 0, 0);
  background: url('../img/Group246.svg') 0% 0% no-repeat padding-box;
  //opacity: 0.07;
}
.Choose{
  top: 456px;
  left: 12vw;
  width: 406px;
  height: auto;
  text-align: left;
  letter-spacing: 0.59px;
  text-transform: uppercase;
  opacity: 1;
  position: absolute;

  p{
    top: 0px;
    left: 0px;
    width: 276px;
    height: 50px;
    text-align: left;
    display: inline-flex;
    font-size: 3vw;
    margin-bottom: 0px;
    letter-spacing: 0.59px;
    color: #FFFFFF;
    text-transform: uppercase;
    span{
      //top: 95px;
      left: 17px;
      width: 217px;
      height: 50px;
      position: relative;
      text-align: left;
      font-size: 3vw;  
      letter-spacing: 0.59px;
      color: #FF3366;
      text-transform: uppercase;
    }
  }
  &::after{
    content:url(../img/Rectangle.png);
    top: 641px;
    left: 217px;
    width: 179px;
    height: 4px;
    opacity: 1;
  }
}
.Group1662{
  top: 600px;
  left: 12vw;
  width: 189px;
  height: 109px;
  background: transparent url('../img/Group1662.svg') 0% 0% no-repeat padding-box;
  opacity: 1;
  position: absolute;
}
.dcafe{
  top: 231px;
  left: 40vw;
  width: 25vw;
  height: 550px;
  position: absolute;
  //transform: matrix(0, -1, 1, 0, 0, 0);
  background: #FF3366 0% 0% no-repeat padding-box;
  box-shadow: 0px 0px 36px #040B4A1A;
  border-radius: 8px;
  opacity: 1;
  p{
    top: 60px;
    height: 61px;
    text-align: center;
    font-size: 3vw;
    letter-spacing: 0.49px;
    color: #ffffff;
    font-weight: bold;
    opacity: 1;
    position: relative;
  }
  .dcafe-inner{
    margin-top: 65px;
    justify-content: end;
    display: grid;
    position: relative;
    img.Dibujo{
      width: 28px;
      height: 28px;
      margin-left: 20px;
    }
    img.MaskGroup2{
      //margin-top: 10px;
      width: 20vw;
      height: 275px;
    }
  }
  .dcafe-inner1{
    margin-top: -205px;
    justify-content: end;
    display: grid;
    img.Dibujo1{
      width: 52px;
      height: 52px;
    }
    img.MaskGroup3{
      width: 295px;
      width: 23vw;
      height: 225px;
    }
  }
  
}
.custom{
  top: 231px;
  left: 70vw;
  width: 25vw;
  height: 550px;
  position: absolute;
  text-align: center;
  //transform: matrix(0, -1, 1, 0, 0, 0);
  background: #FFFFFF 0% 0% no-repeat padding-box;
  box-shadow: 0px 0px 36px #040B4A1A;
  border-radius: 8px;
  opacity: 1;
  p{
    top: 60px;
    height: 61px;
    text-align: center;
    font-size: 3vw;
    letter-spacing: 0.49px;
    color: #768B9F;
    text-transform: uppercase;
    opacity: 1;
    position: relative;
  }
  img{
    text-align: center;
    top: 250px;
    width: 200px;
    height: 200px;
    margin-top: 160px;
  }
  .custom-img{
    top: 495px;
    left: 1418px;
    width: 200px;
    height: 200px;
    background: transparent url('../img/Group1665.svg') 0% 0% no-repeat padding-box;
    //opacity: 0.41;
  }
}
.right{
  top: 0.001953125px;
  left: 90vw;
  width: 259px;
  height: 1070px;
  position: absolute;
  background: transparent url('../img/Subtraction1.svg') 0% 0% no-repeat padding-box;
  //opacity: 0.07;
}