#pioneer {
  display: flex;
  justify-content: center;
  flex-direction: column;
  background: #FAFAFA;
  overflow: hidden;
  z-index: 3;
  width: 100%;
}
#pioneer .container {
  display: flex;
}
#pioneer .container .description {
  padding-top: 99px;
}
#pioneer .container #cancel {
  position: absolute;
  bottom: 80px;
  z-index: 3;
  width: 370px;
  background: white;
  display: none;
}

#pioneer .sub{
  color: black;
  opacity: 0.3;
  margin-top: 50px;
}

#pioneer p{

max-width: 415px;

margin-bottom: 16px;

color: black;

font-weight: 300;
}

#pioneer p.small{

color: #00000073;

font-weight: 500;

font-size: 17px;

width: 100%;
}

#pioneer .tabWrapper{

color: black;

display: flex;

border-bottom: 1px solid #0000002e;

width: 200px;

position: relative;

margin-bottom: 13px;

margin-left: 83px;

z-index: 3;

background: #fafafa;

/* display: flex; */

/* justify-content: center; */
}

#pioneer #tabHandle{

position: absolute;

width: 80px;

height: 4px;

background: #f84536;

bottom: -1px;

border-top-left-radius: 5px;

border-top-right-radius: 5px;

transition: 0.2s ease;
}

#pioneer .tabWrapper .tab{

   padding: 20 0;

   font-weight: 600;

   color: #00000082;

   cursor: pointer;

   width: 79px;

   text-align: center;

   margin-right: 30px;
}

#pioneer button img{
    width: 18px;
    transform: rotate(-90deg);
    margin-left: 8px;
}

#pioneer #ppTabContainer{

position: relative;

height: 378px;

width: 378px;
}

#pioneer #ppTabContainer .tabView{

/* margin-left: -100px; */

/* padding-left: 100px; */

position: absolute;

/* top: 22px; */

left: 0;

width: 100%;

height: 100%;

display: flex;

flex-direction: column;

align-items: CENTER;

text-align: center;
}

#ppTabContainer.tab1 #tab1{

padding-top: 15px;
}

#ppTabContainer.tab1 #tab2{

transform: translate3d(400px, 0px, 10px);
filter: blur(10px);

opacity: 0;
}

#ppTabContainer.tab2 #tab1{

transform: translate3d(-400px, 0px, 10px);

opacity: 0;
filter: blur(10px);

padding-top: 18px;
}

#ppTabContainer.tab2 #tab2{

}

#pioneer .tabWrapper .tab.active{color: black;font-weight: 600;}

#pioneer .container #cancel button {
  background: #c5c5c5;
}
#pioneer .container h2 {
  z-index: 3;
  font-size: 44px;
  margin-bottom: 12px;
  margin-top: -15px;
  text-align: CENTER;
  width: 370px;
}
#pioneer .container h3 {font-size: 14px;margin-bottom: 11px;font-weight: 500;margin-bottom: 4px;}
#pioneer .container button {
  /* width: 196px; */
  height: 50px;
  background: #F84536;
  color: white;
  border: none;
  border-radius: 12px;
  margin-top: 19px;
  font-size: 16px;
  font-family: 'Greycliff';
  font-weight: 700;
}
#pioneer .container .typeform-widget {margin-left: 28px;margin-top: -93px;}
#pioneer .container .left {
  width: 921px;
  padding-top: 99px;
  padding-bottom: -24px;
  padding-right: 3px;
  box-sizing: border-box;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-right: 38px;
}
#pioneer .container .right {
  background: gray;
  flex-grow: 1;
  position: relative;
  overflow: visible;
}

#pioneer .right{

   width: 100%;

   height: 565px;
}

#pioneer .container .right .visual {
  background-size: cover;
  height: 100%;
  width: 884px;
  position: absolute;
  border-radius: 0;
  background-image: url("../../files/system2.png");
}